Witaj jestem Jane i w tej zakładce pokażę Ci ,jak zrobić podstawowy szablon w CSS:
Każdy kod CSS składa się z 2 członów.
a)selektor np.
.column-center-inner
b)kod np.
{background-color: #ffffff ;}
-trzeba uważać by nie usunąć żadnego znaku np. ( ;} ),
ponieważ wszystkie inne kody przestaną działać.
-Podczas pisania kodów CSS , trzeba każdy od siebie oddzielać (selektor) poprzez Enter,
przesunięcie do następnej linijki. np.
.column-center-inner {background-color: #ffffff ;}
.main-inner .column-left-inner {background-image: url(LINK) ;}
.header-inner {border-left: 4px solid white ;}
SPIS NAJCZĘŚCIEJ UŻYWANYCH SELEKTORÓW:
.main-inner - wszystkie kolumny
.column-center-inner - kolumna środkowa
.main-inner .column-left-inner - kolumna lewa
.main-inner .column-right-inner - kolumna prawa
.post - post
h2 - wszystkie nagłówki widżetów (łącznie z tytułem posta)
#PageList1 - menu
#PageList1 li a:link, #PageList1 li a:visited - menu ,ale jako link i gdy po najechaniu zostawiamy
w spokoju
#PageList1 li a:hover - menu po najechaniu
#LinkList1 - lista linków
.post blockquote - cytat
.comment p - komentarz
.avatar-image-container - Avatar
#blog-pager - pager
.blog-pager a - linki pagera (starszy post,nowszy post ,strona główna)
.blog-pager a:hover - linki pagera po najechaniu (starszy post,nowszy post ,strona główna)
SPIS NAJCZĘŚCIEJ UŻYWANYCH KODÓW CSS
{margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;} - pozycjonowanie
{padding: 0px ;} - "odstępy"
{opacity: 90% ;} - przezroczystość (łącznie z tekstem )
{background-color: #000000 ;} - kolor tła
{background-image: url( LINK URL ) ;} - obrazek tła
{box-shadow: 0px 0px 0px white;} - cienie
{border-left: white 2px solid ;} - ramka z lewej strony , po zamianie left na np. bottom , ramka będzie na dole
{border-radius: 10px 10px 10px 10px;} - zaokrąglenie ramek
{font-size: 12px;} - wielkość liter
{margin: 0px -0px;} - margines
NAJCZĘŚCIEJ UŻYWANE LINKI URL DO TŁA
kod - {background-image: url( LINK URL ) ;} w miejsce LINK URL wklejasz któryś z linków poniżej:
JASNE
-białe - http://funkyimg.com/i/GthQ.png
-zielone - http://funkyimg.com/i/GthX.png
-niebieskie - http://funkyimg.com/i/GthV.png
-złote - http://funkyimg.com/i/GthY.png
-różowe - http://funkyimg.com/i/GthW.png
CIEMNE
-czarne - http://funkyimg.com/i/GthR.png
-czerwone - http://funkyimg.com/i/GthS.png
-brązowe - http://funkyimg.com/i/GthR.png
************
Wszystkie wartości liczbowe typu ( 25px) można zmieniać , tak samo jak #000000 , url tła i rodzaje / kolory ramek , cieni itd.KOPIUJĄC , KOPIUJ TYLKO SAM KOD BEZ TŁUMACZEŃ ,PONIEWAŻ INACZEJ KODY NIE BĘDĄ DZIAŁAĆ !!!
Jaki jest kod na pasek, dzięki któremu możemy przesuwać stronę w dół? http://funkyimg.com/i/JhZi.png
OdpowiedzUsuńJeśli to jest bardziej skomplikowane to nie musisz wszystkiego tłumaczyć :)
Ten kod otrzymałam od pewnej bardzo miłej osóbki ,a dokładnie z jej bloga :) wyślij jej komenta jak użyjesz ok ? proszę bardzo LINK a kod wygląda tak :)
Usuń}
vertical {
background-color:#000000;
height: 50px;
}
::-webkit-scrollbar {
height: 10px;
width: 9px;
background-color: #000000;
}
::-webkit-scrollbar-thumb{background: #ffffff ;
border-radius:5px;}
}
POZDRAWIAM ! :D
Dzięki!
Usuń