[Axoi]

#webdevw30dni #webdev

Dzień 4 i 5

Zabawy bootstrapem ciag dalszy. A dokładniej:

1. Zrobienie sticky footer, dzięki pomocnym osobom które powiedziały mi pod jakim hasłem tego szukać.

2. Zabaw z RWD ciąg dalszy - Starałam się utworzyć galerie obrazków która zachowuje się sensownie w zależności od rozmiaru strony - i nawet mi to wyszło chyba. No i starałam się zrozumieć idee RWD ogólnie.

3. Zabawa ze stylowaniem botstrapa i zrobieniem w miarę ładniej strony. Czy robię to dobrze? Tzn, załączając po arkuszu bootstrapa swój własny i nadpisując w nim klasy bootstrapa? Ładnie wyszło? :)

Efekt będący przeróbką efektu dnia 3. W momencie kiedy pomyślałam że dobrze byłoby mieć też efekt dnia trzeciego zapisany ten... No, już miałam połowę z niego zmodyfikowaną.

http://axoi.t15.org/index.html

tag #webdev zawołam jeszcze tylko do wpisu finalnego - jeśli interesują cie moje postępy obserwuj na mój tag. :)

#webdevw30dni

[M.....a]

@Axoi: śliczne :)

2/10

[t.....0]

Lorem ipsum jest obsolate, korzystaj z http://korwinipsum.pl/

[Mortale]

@Axoi:

1. Sticky Footer działa dzięki podanej wysokości stopki. Jeżeli dodasz tam więcej treści i zmniejszysz szerokość strony, wysokość stopki się zmieni. Dlatego lepiej wysokość stopki dodać przez javascript/jQuery lub zrezygnować z takiej stopki na rzecz zwykłej i po prostu zadbać o odpowiednią ilość treści.

2. Jak dodajesz

col-md-2

to nie musisz dawać

col-lg-2

. Zrobi się to automatycznie. Tak samo rozważ czy

col-sm-3

i

col-xs-3

to dobre wielkości, strony RWD

[Axoi]

@Mortale: Dziękuję. :)

1. Na razie nie ruszałam js, więc zrobiłam w ten sposób.

2. Rozumiem. I w sumie źle to sprawdzałam, bo zmniejszając okno przeglądarki a nie używając telefonu etc. Teraz widzę że źle to wygląda.

3. A przemawia za tym...? W stronach które analizowałam były używane te dwa sposoby tak pół na pół, więc stwierdziłam że wezmę coś co wydaje mi się logiczniejsze.

4. Hm... To akurat przez to

[cordant]

@Axoi: nie jest źle, widziałem stronę w pierwszy dzień ostatnio. I co, z Bootstrapem RWD nie straszne? ( ͡º ͜ʖ͡º) Polecam też zobaczyć jak zrobić RWD od zera. Ja wiem, że są frameworki które to robią z automatu, ale czasem też trzeba wiedzieć jak się zachować jak się go nie używa.

[Axoi]

@cordant: Nie straszne! Hm. Czyli zrobienie RWD od zera to challange na któryś z przyszłych dni.

[cordant]

@Axoi: Raczej nie challange, bo to głównie polega na tym aby w CSS do danej rozdzielczości przypisać parametry klasom. To raczej takie żeby wiedzieć jak to działa i żeby nie kojarzyć RWD z

[Mortale]

@Axoi:

3. Jest to zły nawyk którego należy się wyzbyć. Zmieniasz tylko kolor tła - ok. Ale przypuśćmy, że dodasz

margin

i

padding

. Następnie wyjdzie nowa wersja Bootstrap która zmienia klasę

navbar

którą Ty edytowałaś. Bądź zmienia działanie

col-md-*

lub klasy

row

. W tym momencie strona Ci się rozpada.

Inaczej - najlepiej jak się cudzych klas nie nadpisuje. Robi się to swoimi klasami. Oczywiście są przypadki gdy korzysta się

[Mortale]

@Axoi: RWD to

@media screen and (max|min-width:xxx px) and (max|min-width:xxx px) {

.nazwa-klasy { /* jakieś własności klasy od tej do tej szerokości ekranu */ }

}`

[cordant]

@Mortale: No o tym mówiłem właśnie ;)

@Axoi: Co do wspomnianego przez @Mortale codeacademy - super sprawa, mowilem Ci o tym w pierwszym Twoim dniu. Masz kurs "Make your own website", php, JS, wszystko co dusza zapragnie. To raczej traktuj jako challange :P

[Axoi]

@Mortale: Dziękuję za wytłumaczenie mi dlaczego nie należy nadpisywać klas - zrozumiałam, i będę stosować własne klasy. :)

7. Studiuję informatykę. Więc z programowaniem mam sporo styczności. W każdym razie znam podstawy. :)

@cordant: Prawdę mówiąc zaczęłam tamten kurs. :) Nie wspominałam o tym w wpisach bo to nie jest jeszcze cos czy mogę się chwalić.

[moon5]

@Axoi: Jaki to hosting, jeśli można wiedzieć?

[Axoi]

FreeHostingNoAds.net, tylko z powodu braku reklam. Ale kasują nieaktywne konta. Znalazł mi go znajomy.

[moon5]

@Axoi: Dziękuję, ja po doświadczeniach z GoDaddy i Hostgator, wybieram się na darmowy 000webhost.com (tam też kasują nieaktywne konta) albo na polski Hostinger, ale tego drugiego zupełnie nie znam.

[R4vPL]

@moon5: hostinger nie jest polski. Hostinger to to samo co 000webhost, main-hosting bodajże.

[moon5]

@R4vPL:

Dzięki za info.

Niedawno widziałam informację, że Hostinger to część 000webhost.com, czy na odwrót. Nawet sprawdzałam wczoraj, ale już nie ma tego (?). Dlatego napisałam, tak jak mi się kiedyś wydawało, że to Hostinger jest polski.