Projektowanie i tworzenie stron internetowych

poradniki, kursy o projektowaniu, tworzeniu i pozycjonowaniu stron www

Dyrektywa stylu CSS !important

Chciałbym omówić dyrektywę !important w arkuszu stylów CSS. Jest to bardzo przydatny element pozwalający nam definiować elementy w CSS, które są opisane np. w HTMLu. W dobie responsive web design dyrektywa pozwala na zdefiniowanie wielkości danych elementów na stronie internetowej. W skrócie dyrektywa !important wskazuje na najważniejszy opis danego elementu, opis elementu w kodzie strony www, ważniejszy niż wynikałoby to z kolejności.

Na przykład kod mapy Google:

<iframe width="800" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" 
src="https://maps.google.pl/maps?f=q&amp;source=s_q&amp;hl=pl&amp;geocode=&amp;q=olsztyn&amp;
aq=&amp;sll=53.459057,20.023798&amp;sspn=1.313163,3.56781&amp;ie=UTF8&amp;hq=&amp;hnear=Olsztyn,
+warmi%C5%84sko-mazurskie&amp;t=m&amp;z=12&amp;ll=53.778422,20.480119&amp;output=embed"></iframe>

src="https://maps.google.pl/maps?f=q&source=s_q&hl=pl&geocode=&q=olsztyn&

aq=&sll=53.459057,20.023798&sspn=1.313163,3.56781&ie=UTF8&hq=&hnear=Olsztyn,

+warmi%C5%84sko-mazurskie&t=m&z=12&ll=53.778422,20.480119&output=embed"></iframe>

W telefonach komórkowych taka szerokość mapy nie będzie wyglądać korzystnie, problem załatwi nam kod:

iframe { width:100% !important;}

1	iframe { width:100% !important;}

Dzięki temu elementowi możemy wyróżnić dany moduł strony internetowej bez konieczności nadawania mu dodatkowej klasy czy id.

Dla jednego elementu opisanego możemy użyć dowolna liczbę znaczników !important, np.

iframe { width:100% !important; height:100px !important; border:1px solid #FFF; float:left !important; }

1	iframe { width:100% !important; height:100px !important; border:1px solid #FFF; float:left !important; }

Zapraszamy do komentowania artykułu "Dyrektywa stylu CSS !important" oraz odwiedzin strony www Olsztyn.

8 listopada, 2013

Powrót

Komentarze do Dyrektywa stylu CSS !important

Boob 19 lutego 2014, godzina: 15:03

Spoko ale zastosowanie tej dyrektywy świetnie sprawdza się przeróbkach jakiś gotowych elementów. Np wtyczek w WP, nie trzeba wtedy grzebać w oryginalnych CSS tylko wszystkie korekty się wrzuca do jednego pliku.

admin 04 marca 2014, godzina: 22:04

Dokładnie ale robi się z tego spora ilość niepotrzebnego kodu CSS 😉

Dodaj komentarz do tego artykułu

Zobacz także

Tworzenie przycisku na potrzeby strony www

Nie od dzisiaj wiadomo, że czym mniej obrazków, czyli czym mniej “waży” nasza strona www, tym lepiej. Strona internetowa szybciej się ładuje jest przyjaźniejsza dla użytkowników jak i robotów wyszukiwarek. W tym artykule zaprezentuje metodę tworzenie fajnych przycisków na potrzeby stron internetowych bez użycia grafiki. Kolejnym atutem takiego rozwiązania jest ustawienie dowolnej wielkości takiego obiektu, czyli przycisk będzie wyglądał identycznie na telefonie, tablecie czy komputerze stacjonarnym. Nie będziemy potrzebować trzech …

31 sierpnia, 2013

więcej

Tworzenie pierwszego arkuszu CSS na potrzeby strony www

Od czego zacząć pisanie pierwszego kaskadowego arkuszu stylów CSS na potrzeby strony www, proponuję rozpocząć cały proces od ustawień ogólnych naszej strony internetowej. Wprowadzimy ustawienia ogólne dla wszystkich najpopularniejszych znaczników naszej stronie a później będziemy definiować precyzyjnie każdy z elementów. Ułatwi to nam cały proces tworzenia strony www. Nazywam ten proces “czyszczeniem”. Przed rozpoczęciem pracy powinniśmy mieć już gotowy projekt strony internetowej, tak że widzimy jak nasza witryna internetowa będzie …

5 lipca, 2013

więcej

Czym są style CSS

Style CSS Cascading Style Sheets (Kaskadowe Arkusze Stylów), to elementy strony internetowej określające nam wygląd, położenie a nawet animację danych elementów strony www, a dokładniej zdefiniowanych elementów kodu HTML. Dzięki CSS możemy określić np. kolor danego elementu, wielkość czcionki, animację po najechaniu czy kliknięciu, położenie względem innych elementów, wymiary i inne wartości budujące całą stronę internetową. Kod HTML buduje nam strukturę witryny a styl CSS określa właściwości tej struktury.

5 czerwca, 2013

więcej

Najnowsze na stronie

Kategorie

Tagi

Archiwum

Archiwa

Jedna strona dla wszystkich Urządzeń. Tworzymy responsywne strony internetowe Responsive web design (RWD). Nowatorskie, z oryginalną, pomysłową szatą graficzną, wyposażone w system zarządzania treścią (CMS). Przejrzyj naszą stronę na smartfonie. Jeśli jeszcze nie masz dochodowej mobilnej strony internetowej, nie czekaj! Napisz do nas lub zadzwoń. Stworzymy ją dla Ciebie!
Prowadzący obecnie działalność handlową wiedzą, że głównym kanałem sprzedaży jest sklep internetowy Olsztyn. Twój nowoczesny sklep internetowy powinien posiadać ciekawy projekt graficzny, przyjazną i intuicyjną nawigację oraz prostą i zrozumiałą ścieżkę zakupową. Responsywność sklepów internetowych to już podstawa.