Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][PHP] jak radzicie sobie z układaniem zdjęc na stronie
Forum PHP.pl > Forum > Przedszkole
lamcpp
witam, pytanie dotyczy pomysłu, sposobu: jak układacie zdjęcia w waszej galerii na stronie, żeby to dobrze wyglądało mając poziome i pionowe zdjęcia?
Ja wymysliłem zeby kazde zdjęcie które wczytywane jest w pętli z bazy dać w diva.
Następnie w CSS ostylować tego diva, dając mu np. padding-left i padding-right oraz float: left;. A co do problemu ilości zdjęć w rzędzie, to dodałem pomocniczą zmienną o nazwie licznik oraz drugą zmienną, która informuje ile ma być zdjęć w rzędzie - ma wybrałem 5. I następnie robie, jeśli licznik będzie = drugiej zmiennej czyli 5 to wyświetlam echo '<br /><br />'; Czyli dwie nowe linie. Teoretycznie może i jako tako pomyslane, ale w praktyce to nie działa za bardzo, tymbardziej ze zdjecia mają rózne rozmiary bo są i pionowe i poziome.
Wynik u mnie wygląda tak że jest jeden rząd 5 zdjęć, pozniej poniżej z prawej strony jest jedno zdjęcie, póżniej w kolejnym rzędzie znowu 5 zdjęć i znowu jedno...podejrzewam że coś z tym <br /> jest nie tak,ze tylko o jakąś czesc linii mi przesuwa a nie o całe zdjęcie nizej i nie ustawia po lewej mimo ze float left.
Dlatego chciałem zapytać jak Wy sobie radzicie z ładnym wyswietlaniem zdjęć na stronie
Spawnm
daj tabele lub divy z stałym width i height , potem przy wyświetlaniu daj naliczanie np. $x++ i sprawdzanie $x%5==0 jeśli zero to łamiemy.
w przypadku tabel dodajesz <tr/> jeśli divy to zmieniasz klasę.
t4keda
A nie lepiej jest zrobić to na liście? Nadajesz liście szerokość i w tej szerokości elementy muszą się zmieścić, jak się nie zmieszczą to do następnego rzędu zejdą.
thek
Div z wysokością i szerokością nadaną oraz float:left. W rzędzie zawsze będzie tyle ile się zmieści. Bez kombinowania z ifami i modulo by "łamać" wiersz po odpowiedniej ilości. Ale to tylko gdy mam mieć dużo na stronie. Wszystko od tego zależy jak planuję galerię dla end-usera wyświetlać. Czy miniaturki czy może z next, prev czy jeszcze inaczej.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.