Računala, Programiranje
Vertikalne CSS izbornika: rade sami
Neki webmasteri ne žele provesti vrijeme u razvoju od nule jednostavnih elemenata koji već postoje. Oni smatraju da nema smisla gubiti vrijeme na nešto što je dugo bio tamo. U stvari, za one koji su samo mastering HTML i CSS, važno je da se puno stvari da se dobro razumijevanje njihovog rada. Ovo se odnosi na meni. Stvoriti vertikalnu CSS izbornika. To će biti samo na osnovu HTML i CSS, bez upotrebe Javascript i jQuery. Svaki meni je lista linkova koji vode na stranice sajta.
osnovnih koraka
Za stvaranje jednostavnih vertikalnom meniju CSS, potrebno vam je sljedeće korake:
1. Prvo, utvrditi listu linkova (koristeći kod HTML), od čega će meni biti. Dajte im ime, na primjer, su kako slijedi:
- Home.
- Naša istorija.
- Voditi.
- Usluga.
- Kontakti.
2. Zatim Styling veze kako želite uz pomoć CSS-a.
Pišemo HTML koda, imajte na my_Vmenu.html datoteku i vidjeti kako će izgledati u browseru:
Ovo je osnova (kostur) našeg izbornika. # 1, # 2, itd treba zamijeniti po referenci. Pogledajte kako to izgleda u pretraživaču. Slika ćete ne sviđa. Sada moramo početi opisati elemente stila, kako bi se potpuno vertikalne CSS izbornika.
Opis stilova
Stvoriti my_Vmenu.css datoteka, koji je postavio sve što želite poboljšati izgled tako važan element stranice. Ovdje je kod, od kojih uvod će revitalizirati vertikalne CSS izbornika. To i pisati novu datoteku, a onda ćemo malo bolje pogledati značenje glavne linije koje su date.
DETALJAN OPIS koristi stila
Sada razmotriti detalje naše CSS vertikalni meni:
ul # my_Vmenu - ukupni stil cijele liste.
ul # my_Vmenu li je - stil veze između taga li.
ul # my_Vmenu li a: hover - opis vrste uzimajući u obzir stavke izbornika u vrijeme kada se lebdi nad ljudima.
ul # my_Vmenu li raspona - tekstualni opis (naziv izbornika).
Imajte na umu da datoteke my_Vmenu.css my_Vmenu.html i mora biti sačuvan u istom direktoriju. Međutim, oni se može nalaziti u različitim folderima, ali onda je važno da se registruje u my_Vmenu.html put datoteku my_Vmenu.css. Budite oprezni, jer su pridošlice na ovaj problem često.
Stil mora biti povezan između glave oznaka u HTML-datoteku. menu_1.png i menu_2.png - ovo je slika za tu stavku izbornika sliku u normalno stanje i lebdenja.
Bolje je spasiti slika u posebnom folderu za slike, reci my_images, ali onda Podesite CSS kod. Napišite gdje su prikazani ove slike, oni su u ovom direktoriju: url (my_images / menu_1.png) i url (my_images / menu_2.png).
U ostatku imovine opisane u CSS kod, lako shvatiti. Oni definišu izgled našeg izbornika. Lako je primjetiti da je širina i visina predmeta navedene za iste stavke u normalno stanje, a kad letite mišem preko njih. Veličina slova 18PX, padding određuje uvlačenje sa različitih strana imena mjesta. zaslon omogućuje da postavite jedinicu prikaz za podešavanje širine i padding.
Naša vertikalni meni
Kao što možete vidjeti, vertikalne CSS izbornika lako stvoriti. Na osnovu podataka znanja ćete moći da to lijep i atraktivan za posjetitelje na svoje web stranice! Koristite svoju maštu, a zatim moderan meni da upotpune svoje stranice.
Similar articles
Trending Now