Mirki jak osiągnąć szybko taki efekt jak na obrazku z użyciem #html #css? Position absolute odpada, bo będzie tego kilkanaście sztuk pochowanych w divach. W środku będzie sam tekst. Mi niestety nie wychodzi ułożenie tego :( #programowanie
Wszystko
Najnowsze
Archiwum
- 1
@paweo: nie jestem przy kompie, może jutro wkleję swoje rozwiązanie ale poczytaj o CSS Grid i właśnie Flexbox.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
Float unikaj, table już się raczej tez nie używa.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
Float unikaj, table już się raczej tez nie używa.
Pytanie do #webdev.
Mam zrobić takie coś jak na zdjęciu.
Wszystkie dane będą zaciągane z bazy. Zrobiłem coś takiego, ale nie jest to ni w 5 ni w 9 responsywne.
Zdjęciom nadałem inline width 100% i idealnie mieszczą się w kontenerach, ale tekstu w kontenerze nie potrafię utrzymać.
Ktoś ma jakiś szablon z instrukcją jak to zrobić
Mam zrobić takie coś jak na zdjęciu.
Wszystkie dane będą zaciągane z bazy. Zrobiłem coś takiego, ale nie jest to ni w 5 ni w 9 responsywne.
Zdjęciom nadałem inline width 100% i idealnie mieszczą się w kontenerach, ale tekstu w kontenerze nie potrafię utrzymać.
Ktoś ma jakiś szablon z instrukcją jak to zrobić
źródło: comment_wXOxfcF6YfxUw65bTLlONudw3740lK8N.jpg
Pobierz- 3
@zortabla_rt: flexbox
mirki, czego musiałbym użyć żeby stworzyć stronkę do wymiany zdań? Najprostsze, nawet mniej zaawansowane niż forum, tylko lista postów i formularz do dodawania z nazwą użytkownika, miejscem na mail, tytuł i treść posta. Znam PHP, HTML+CSS, podstawy JS, co jeszcze do tego potrzebuję? W czym najlepiej to zaimplementować? #webdev #naukaprogramowania #php #html #css
- 3
@look997: wut
źródło: comment_AiPuf0MJzQFT3h5UliM5i4Url589R4oz.jpg
Pobierz
konto usunięte via Android
- 3
@look997 to by było fajne
- 3
Czy ze strony WWW która używa własnej czcionki można jakoś zassać na dysk komputera pliki .ttf albo .otf? Czy tam jest w innym formacie z którym nic nie zrobię? Potrzebuję do przygotowania projektu graficznego dla klienta. #css
- 1
@sierzchula: jestem grafikiem i słabo się w tym orientuję o czym piszesz :( Chodzi mi o czcionkę która wyświetla się np. na sliderze http://www.canalplus.pl "Upadek królestwa 2" Pokazuje mi, że jest to "C Light/Demi/Bold".
- 1
W sumie to mi wyszło, że to jest Futura BG tylko chyba ze zmienioną nazwą ;)
- 1
#css
Mirki,
co ja popełniłem że podpisy są pod zdjęciami a nie obok nich? Szukam po kodzie, szukam i widzę nic...
Mają być pod nimi dopiero jak szerokość strony jest mniejsza czyli na telefonach.
https://strefa.pro/nieruchomosci/
Kod PHP generujący stronę:
Mirki,
co ja popełniłem że podpisy są pod zdjęciami a nie obok nich? Szukam po kodzie, szukam i widzę nic...
Mają być pod nimi dopiero jak szerokość strony jest mniejsza czyli na telefonach.
https://strefa.pro/nieruchomosci/
Kod PHP generujący stronę:
@krzysztof114: nie widzę żeby w tym php coś za to odpowiadało, nie masz namieszane w style.css?
- 0
@uszatysqrviel: wg mnie powinienem dodać coś inaczej z tymi bootstrapowymi kolumnami. W oddzielnej kolumnie foto, a w oddzielnej opisy... Css możesz podejrzeć na stronie.
- 3
@frontendowiec: A nie uważasz, że te linie w tle trochę zmniejszają czytelność tekstu?
@frontendowiec: Lewy padding na kontener, ikona w h3:before, z position: absolute. h3 z position: relative oczywiście.
Coś słaby ten frontendowiec (╭☞σ ͜ʖσ)╭☞
Coś słaby ten frontendowiec (╭☞σ ͜ʖσ)╭☞
#css https://codepen.io/anon/pen/Bdbjaw co jeszcze zmienić, żeby background-color rozciągał się na całą szerokość, ale żeby przyciski miały marginesy od krawędzi?
#css https://codepen.io/anon/pen/eEXpPP Jak zapanować nad tymi zdjęciami, żeby ostatnie nie wyjeżdżało za szerokość strony?
#css jak pionowo wyśrodkować napis I'm your tag line? https://codepen.io/anon/pen/RZdWVw
@normanos: XDDDDDDD
@pinkman356 Całkiem spoko ten blog i z tego co widze ciagle aktualizowany. Ja czytam jeszcze devcorner.pl
- 2
- 192
Czołem Wykopki! Sprawdźcie co dziś dla Was przygotowałem w kolejnym wpisie [ #webstuff ]!
❶ Wpis mireczka @Daredzik o funkcjach anonimowych w #php.
http://bit.ly/2vIVUA7
❷ Prosty, lekki i responsywny system siatki w #css zbudowany przy
❶ Wpis mireczka @Daredzik o funkcjach anonimowych w #php.
http://bit.ly/2vIVUA7
❷ Prosty, lekki i responsywny system siatki w #css zbudowany przy
źródło: comment_1NmfG1qD1qm0dcBfccsg9FRaSsfiRq0t.jpg
Pobierz- 2
#css https://codepen.io/anon/pen/BdMvgv Jak zrobić, żeby tło tekstu było przezroczyste, bo #home ma obrazek w tle, ale, żeby hr miał jakiś ostęp od napisu? tak, żebym miał dwie małe kreski, a nie jedną ciągłą.
- 0
@rbielawski: coś takiego.
źródło: comment_hFu4J9pWpXQ60RcZvEIGskGljfsiHdLT.jpg
Pobierz@frontendowiec: zrób sobie element z tekstem, a do niego daj ::before i ::after robiące za kreski (np. border lub height: 1px i background-color).
A, no i oczywiście tekst ma position: relative (lub inną nie-static), a pseudoelementy mają absolute i odpowiednio right: 100% i left: 100%.
A, no i oczywiście tekst ma position: relative (lub inną nie-static), a pseudoelementy mają absolute i odpowiednio right: 100% i left: 100%.
#css Jak najlepiej określać położenie tekstu przy cięciu psd. Np. mam jumbotron i np. tekst nie jest na środku obrazka tylko ileś tam na dole. Powinienem zmierzyć odległość od samego początku sekcji do pierwszego piksela napisu? i np. dać margin-top: ileś tam pixeli czy np. ustawić pozycjonowanie relatywne, absolutne i też mierzyć ile tam potrzeba? Chciałbym od początku uczyć się dobrych praktyk.
@frontendowiec: Nie da się odpowiedzieć jednoznacznie nie znając danego projektu. Ale generalnie marginesy nie służą do pozycjonowania elementów wewnątrz innych elementów - do tego lepiej stosować position relative/absolute w zależności od potrzeb.
- 1
@frontendowiec: tak jak kolega wyżej mówi, to po prostu zależy od sytuacji i co chcemy osiągnąć. Każde rozwiązanie ma plusy i minusy o których trzeba pamiętać np. używając na desktopie absolute'a na 99% będzie to trzeba poprawić na mobilnej wersji itd. Teraz w dobie flexa możesz nawet nim sobie wypozycjonować element a później go odsunąć marginem, paddingiem albo bottomem/topem
- 3
Cześć,
będę budować swoją pierwszą stronę po 10 latach, rozkminiam sobie różne elementy.
Z grubsza większość już wiem jak rozegrać, mam problem tylko z jedną rzeczą (zał)
Chcę mieć galerię 9 grafik (3x3). Gdy najadę myszką chciałbym żeby było przykryte 80% czernią (na bank nie tylko konwert na grayscale) + byłby tam sformatowany tekst autorów danej pracy. Możliwe, że byłoby tam od groma ludzi, więc musiałby to być scroll w tym okienku. Dodatkowo po kliknięciu
będę budować swoją pierwszą stronę po 10 latach, rozkminiam sobie różne elementy.
Z grubsza większość już wiem jak rozegrać, mam problem tylko z jedną rzeczą (zał)
Chcę mieć galerię 9 grafik (3x3). Gdy najadę myszką chciałbym żeby było przykryte 80% czernią (na bank nie tylko konwert na grayscale) + byłby tam sformatowany tekst autorów danej pracy. Możliwe, że byłoby tam od groma ludzi, więc musiałby to być scroll w tym okienku. Dodatkowo po kliknięciu
źródło: comment_ijnk4Tp3yYGFqFQwCVgDMTRsHXglKzJ7.jpg
Pobierz@loczyn div z obrazkiem A, po najechaniu pojawia sie scrollable div z tekstem, z czarnym tlem z kanalem alfa np 80%. Zrobilbym jakiegos fiddla na szybko ale nie ma mnie w domu :(
@loczyn: Tak jak wyżej, zrób tak jak tutaj, ale zmień width i height, i daj display: none. W javascript dodajesz efekt "fade" po najechaniu. Zrobiłem na szybko przykład: https://jsfiddle.net/jh9huyue/























#udemy #html #css #javascript
https://www.udemy.com/kurs-tworzenia-stron-www-w-html-i-css-od-podstaw-do-eksperta/
https://www.udemy.com/javascript-od-podstaw-do-eksperta/