Forum.Legalne.info: [faq][css] FAQ języka CSS - Forum.Legalne.info

Skocz do zawartości

Otwarty

Ikona Shoutbox

    Rozszerz pole shoutboxa

Ikona Zaloguj się na forum

    • Login:
    • Hasło:


    Zapamiętaj mnie
Strona 1 z 1
  • Nie możesz rozpocząć nowego tematu
  • Nie możesz odpowiadać w tym temacie

[faq][css] FAQ języka CSS Najczęściej Zadawane Pytania

#1 Użytkownik jest niedostępny   musk 

  • random user | ID = user306
  • Grupa: Użytkownicy
  • Postów: 984
  • Dołączył: 22-February 06
  • GG: 2766799
  • MiejscowośćŁęki k/Oświęcimia

Napisany 28 September 2006 - 06:56 PM

Oto temat FAQ styli CSS. Będę tu tworzył listę Często Zadawanych Pytań. Pytania i Odpowiedzi swobodnie możecie mi przesyłać na PW. Zapraszam do tworzenia FAQ :).

Indeks
  • Jak usunąć podkreślenie z linków na stronie?
  • Jak stworzyć układ trzykolumnowy?
  • Jak wykonać wcięcie pierwszej linii akapitu?
  • W jaki sposób mogę wyróżnić pierwszą linię lub literę w danym akapicie?
  • Jak sprawić, aby linki po najechaniu na nie kursorem zmieniały kolor?
  • Jak panować nad wyrównywaniem nowych linijek w liście?
-----------------------------------------------------------------------


Jak usunąć podkreślenie z linków na stronie?

Domyślnie na stronie wszystkie odnośniki są podkreślane. Aby to zmienić, wystarczy utworzyć arkusz CSS i wpisać następującą definicję:

a { text-decoration: none; }


I linki na naszej stronie nie mają podkreślenia :)

Jak stworzyć układ trzykolumnowy?

Zapewne spotykacie często na różnych stronach układy oprate na trzech kolumnach. Taki szablon można łatwo wykonać przy pomocy styli CSS. Na naszym forum jest na ten temat tutorial. Znajduje się on tutaj.

Jak wykonać wcięcie pierwszej linii akapitu?

Nie jest to nic trudnego. Wystarczy wpisać w arkuszu:

p { text-indent: x; }


Jako x podstawiamy wielkość wcięcia.

W jaki sposób mogę wyróżnić pierwszą linię lub literę w danym akapicie?

Do wyróżnienia pierwszej litery służy pseudoklasa first-letter. Np. taki kod:

p:first-letter { color: red; }


sprawi, że pierwsza litera w akapicie będzie kolru czerwonego. Oczywiście można używać wszystkich właściwości, zachęcam więc do eksperymentowania nie tylko z kolorami, ale i z np. wielkościami.

Aby wyróżnić pierwszą linię, należy użyć pseudoklasy first-line:

p:first-line { font-weight: bold; }


Powyższy kod sprawi, że pierwsza linia akapitu będzie pogrubiona.

Jak sprawić, aby linki po najechaniu na nie kursorem zmieniały kolor?

Tak, to ciekawy i bardzo prosty efekt. Wystarczy w arkuszu CSS wpisać:

a:hover { color: x; }


Jako x podstawiamy wartość koloru. Oczywiście można używać wszystkich innych właściwość CSS, a nie tylko właściwości color.

Jak panować nad wyrównywaniem nowych linijek w liście?

Kiedy mając na stronie listę (<ol> lub <ul>) wprowadzimy do niej tekst dłuższy niż jedna linia, linia umieszczona niżej nie zostanie wyrównana do markera, ale do brzegu pojemnika - co niektórym może przeszkadzać. Jednak za pomocą CSS można łatwo to zmienić. Wystarczy wpisać:

ul { list-style-position: outside; }


I tekst jest wyrównany do markera :).

-----------------------------------------------------------------
Masz problem ze stylami CSS? Nie potrafisz osiągnąć zamierzonego efektu? A może masz doświadczenie i chcesz się nim podzielić z innymi proponując pytania do FAQ? Pisz na PW.
Musk


Połączyłem twoje psty w jeden - wyglądało jak nabijanie postów, a dzięki temu jest czytelniejsze.
Marcho

"Kiedy trzymasz gorącą patelnię - sekunda jest godziną, lecz gdy trzymasz gorącą dziewczynę - godzina jest sekundą."
0

#2 Użytkownik jest niedostępny   d.karola 

  • Gaduła
  • Grupa: Użytkownicy
  • Postów: 170
  • Dołączył: 23-September 06
  • MiejscowośćWarszawa

Napisany 28 September 2006 - 08:47 PM

Moim zdaniem pomysł dobry ale radziłabym adminom/moderatorom przenieść do "ważne tematy", ponieważ ktoś napisze nowy temat a ten pójdzie w dół.

No ale jeżeli chodzi o pomysł to pochwalam :)
http://e-layouts.info

www.e-layouts.info jest stroną, która pomaga rozwijać się wszystkim internautom tworzącym własne strony www. Jeżeli masz problem lub pogubiłeś się w świecie htmlu - napisz! My pomożemy każdemu! A w naszym prtalu znajdziesz również : szablony - darmowe i na zamówinie, instrukcje, dodatki, FAQ i wiele, wiele innych. Zapraszam!
0

#3 Użytkownik jest niedostępny   ziele 

  • Pasjonata ;d
  • Grupa: Użytkownicy
  • Postów: 2678
  • Dołączył: 17-October 06
  • MiejscowośćGrójec

Napisany 28 December 2006 - 05:07 PM

także pochwalam jednak z tego co widze słabo to się rozwija :/
0

#4 Użytkownik jest niedostępny   musk 

  • random user | ID = user306
  • Grupa: Użytkownicy
  • Postów: 984
  • Dołączył: 22-February 06
  • GG: 2766799
  • MiejscowośćŁęki k/Oświęcimia

Napisany 28 December 2006 - 06:27 PM

Rzućcie jakimś pytaniem, to dodam -_-. Sam nie mam weny...
"Kiedy trzymasz gorącą patelnię - sekunda jest godziną, lecz gdy trzymasz gorącą dziewczynę - godzina jest sekundą."
0

#5 Użytkownik jest niedostępny   Blondi 

  • Nowicjusz
  • Grupa: Użytkownicy
  • Postów: 7
  • Dołączył: 15-October 06

Napisany 19 September 2007 - 06:02 PM

Proszę:
mam na stronie trzy sekcje div:

div#naglowek {
  position: absolute; top: 0; left: 10%;
  width: 80%;
  height: 40%;
}

div#przyciski {
   position: absolute; top: 50%; left: 10%;
   width: 15%;
   height: 50%; 
}

div#tresc {
   position: absolute; top: 50%; left: 30%;
   width: 60%;
   height: 50%; 
} 


Jak widać nagłówek i przyciski powinny znajdować się w równej odległości od lewego brzegu ekranu a przyciski i treść powinny zaczynać się na tej samej wysokości. Oczywiście w rzeczywistości tak nie jest, a co ciekawsze w każdej przeglądarce jest inaczej nierówno.
Mam wrażenie, (choć już nie mam siły sprawdzać... a nie pamiętam), że może było równo, dopóki divy były puste.
Kolejny problem to pozycjonowanie elementów w poszczególnych divach. Jak już uda mi się w jednej przeglądarce, to w innej wszystko jest rozp.... CZY JEST NA TO JAKIŚ UNIWERSALNY SPOSÓB??? Bo ja jestem załamana...

// Kod == [*code]
// pagenoare.
0

#6 Użytkownik jest niedostępny   Sasi 

  • Rozkręca się
  • Grupa: Użytkownicy
  • Postów: 45
  • Dołączył: 19-June 09
  • GG: 2090774

Napisany 12 August 2009 - 04:00 PM

Jak zrobić zaokrąglone rogi obrazka ?
Jak wyśrodkować diva ?
0

#7 Użytkownik jest niedostępny   Code Hunter 

  • Elita
  • Grupa: Użytkownicy
  • Postów: 1122
  • Dołączył: 22-February 07
  • GG: 719765
  • MiejscowośćWarszawa

Napisany 12 August 2009 - 05:13 PM

@2 ustalasz szerokość i dajesz margin: 0 auto;

@1 chyba:
-moz-border-radius-bottomleft:4px;
	-moz-border-radius-bottomright:4px;
	-moz-border-radius-topleft:4px;
	-moz-border-radius-topright:4px;

Tylko Gecko i Safari. Ewetnualnie 4 obrazki tła na rogi.
Nigdy nie będę umiał tyle, żebym nie mógł się nauczyć więcej.
Pomocy na gg udzielam tylko wtedy, gdy sam ją zaproponuję!!!
0

Prześlij ten temat:


Strona 1 z 1
  • Nie możesz rozpocząć nowego tematu
  • Nie możesz odpowiadać w tym temacie

1 Użytkowników czyta ten temat
0 użytkowników, 1 gości, 0 anonimowych użytkowników


               
           
       
Nasza strona internetowa wykorzystuje cookies (pol.: ciasteczka)

Na naszej stronie wykorzystujemy ciasteczka (ang. cookies), dzięki którym nasz serwis może działać lepiej - więcej o tym w Naszej polityce prywatności. W każdej chwili możesz wyłączyć ten mechanizm w ustawieniach swojej przeglądarki. Korzystanie z naszego serwisu bez zmiany ustawień dotyczących cookies, umieszcza je w pamięci Twojego urządzenia.

Akceptuję   Zmiana ustawień