Maachen eng horizontal Menü fir de Site selwer

Horizontal Menü hunn bal all Site - et ass e wichtege Bestanddeel, well et kann een mat sengem Optrëtt an Benotzerfrëndlechkeet ze lackele oder, Ëmgedréit, erféieren ewech Visiteuren. Loosst d'léieren wéi en Elementar- horizontal Menü ze schafen: maacht et "Skelett" zu HTML, déi elementar Kenntnisser vun schafen ze Meeschtesch. Dir kënnt sécher e prett Menü fannen, mä vill souguer ze léieren, wéi et selwer ze entwéckelen. Et ass flott Spaass.

Léieren Menü ze maachen

Mir probéieren net aus der semantics zu wäicht, déi zu de féierende Zuele vun der Layout unhänken. Éischt muss Dir eng "Skelett" fir eis Menue ze HTML maachen, elementar Kenntnisser léieren fir hir eege horizontal Menue maachen. An dann ass et Fiche, Stil Blieder benotzt. Loosst eis horizontal Menü 5 Elementer enthält. Den éischte Punkt wäert zu der Homepage gouft ginn. Den zweeten Punkt - "Iwwert eis". Déi drëtt - "Eis Auszeechnunge". Véiert - "Et ass Spaass." Fënneften - "Kontaktéiert eis".

HTML-Code gesäit wéi dës:

Wien weess net: ech Tag ass fir d'benotzt Kugel, fänken hiren Elementer mat der Li. Li Tags ierwen der ënnerstëtzen dass dem ech applizéiert ginn.

Ech - Spär Element vun der Lëscht, ass et zu der Breet hat ginn. Li ass och eng Spär.

Also, schafen eng index.html. Mir sammelen eisem Code. Op dësem Punkt, weist de Browser vertikalen engem anstatt eng horizontal Menü. Mee mir mat Iech Schoss - eng horizontal Menü fir de Site ze maachen. Fir dës brauchen mir CSS.

Wat ass CSS?

Wann Dir nach d'Entwécklung vun Siten ze Meeschtesch hunn, ass et néideg mam Konzept vun Kaskadespär Style Sheets ze leieren. An Tatsaach, sinn dës d'Regele fir wat, Veraarbechtung, wat zu verschidden Elementer op de Säiten vun engem Web-Site applizéiert ginn. Wa mir d'Eegeschafte vun der Elementer am Standard HTML beschreiwen, muss dir dëst puer mol ze widderhuelen, Dir eng Verdueblung vun der selwechter Stécker vum Code kréien. Säit opbauen Zäit op de Computer d'Benotzer wäert wuessen. Ze vermeiden dat, do ass eng CSS. Et suffices nëmmen eemol gewësse Element ze beschreiwen, an dann einfach soen wou d'Eegeschafte vun engem bestëmmte Stil ze benotzen. Et ass méiglech der Beschreiwung vun net nëmmen den Text vun der Säit selwer, mä och an anere Fichier ze maachen. Dëst wäert erlaben d'Beschreiwung vun de verschiddene Stiler op all Säiten vum Site ze gëllen. Et ass och praktesch e puer Säiten ze änneren, d'CSS-Fichier verbidden. Style Blieder erlaben Iech mat Policen op engem besseren Niveau ze schaffen wéi der HTML, hëllefen der Grafiken Säiten vum Site ze vermeiden lo wei.

Benotzt Style Sheets fir Menü Entwécklung

CSS-Code fir de Menü:

1. # My_1menu {Lëscht-Stil: Keen; padding: 6; Breet: 800px; Spillraum: Auto;}
2. # My_1menu Li {fléien: lénks; Schrëft: kursiv 18px Arial;}
3. # My_1menu engem {Faarf: # 756; Haaptsäit: blockéieren; Héicht: 55px; Linn-Héicht: 55px; padding: 0px 15px 0px 15px; Hannergrond: #dfc; Text-Dekor: Keen;}
4. # My_1menu engem: hover {Faarf: #foa; Hannergrond: # 788;}

mer elo um doraus horizontal CSS Menü kucken elo.

# My_1menu - sou ass et Stil Aufgab fir UL- Element mat der id = my_1menu, Lëscht-Stil: Näischt - dat Kommando d'Mark vun de geplangte heizou lénks ze läschen.

Breet: 800px - d'Breet vun eise Menü ass 800 Pixel.

padding: 0 - dat schaaft d'bannen padding.

Spillraum: Auto - vyravnivnie am Zentrum vun eiser Säit horizontal Menü.

# My_1menu Li - Stiler Li-Elementer Attributiounsregele.

Héicht: 55px - Menü Héicht.

# My_1menu engem: hover - Stiler zu Element Attributiounsregele a wann et ass entschlof Maus.

Mir wäerten net all Linn am Detail beschreiwen, wéi all Entwéckler seng Parameteren hei bestëmme kann. Dëst Basis fir de Gebrauch vun Stiler am Menü op der Websäit. Dir kënnt et ginn eng méi fäerdeg a schéin krut, Biller benotzt. Uginn Element awer, zum Beispill, Hannergrond: URL (img1.png) widderhuelen-x. Loosst et ginn Hannergrond: URL (img2.png) widderhuelen-x fir en: hover.

Benotzen Är Imaginatioun, kreativ Virléiften. Dann op Basis vun deem Wëssen op wéi engem einfachen Menü op der Websäit ze schafen, kënnt Dir eng Säit mat hirem eegenen eenzegaarteg Design entwéckelen.