Gwnewch bwydlen llorweddol ar gyfer y safle eich hun

dewislen llorweddol wedi bron unrhyw safle - mae'n rhan bwysig, ag y gall gyda'i golwg a defnyddioldeb i ddenu neu, i'r gwrthwyneb, ddychryn ymwelwyr. Gadewch i ni ddysgu sut i greu bwydlen llorweddol elfennol: ei gwneud yn "sgerbwd" i HTML, i feistroli sgiliau sylfaenol greu. Gallwch sicr yn dod o hyd i fwydlen barod, ond yn llawer brafiach i ddysgu sut i ddatblygu eich hun. Mae'n hwyl 'n bert.

Dysgwch sut i wneud bwydlen

Rydym yn ceisio peidio â gwyro oddi wrth y semanteg, a oedd yn cadw at y ffigurau blaenllaw y cynllun. Yn gyntaf rhaid i chi wneud yn "sgerbwd" ar gyfer ein bwydlenni i HTML, dysgu sgiliau sylfaenol i wneud eu bwydlenni llorweddol eu hunain. Ac yna bydd yn addurno, gan ddefnyddio dalennau arddull. Gadewch ein bwydlen llorweddol yn cynnwys 5 eitem. Bydd Yr eitem gyntaf yn cael ei ailgyfeirio i'r dudalen gartref. Yr ail bwynt - "Amdanom ni". Mae'r trydydd - "Ein gwobrau". Pedwerydd - "Mae'n hwyl." Pumed - "Cysylltwch â ni".

HTML-god yn edrych fel hyn:

Pwy sydd ddim yn gwybod: tag ul ei ddefnyddio ar gyfer y bwled, ei elfennau yn dechrau gyda'r li. tagiau li etifeddu arddulliau sy'n cael eu cymhwyso at y ul.

Ul - elfen bloc y rhestr, bydd yn cael ei hymestyn i'r led. Li hefyd yn bloc.

Felly, yn creu index.html. Rydym yn casglu ein cod. Ar y pwynt hwn, mae'r porwr yn arddangos fertigol yn hytrach na bwydlen llorweddol. Ond rydym gyda chi nod - i wneud bwydlen llorweddol ar gyfer y safle. Ar gyfer hyn, mae angen CSS.

Beth yw CSS?

Os oes gennych chi i feistroli datblygu safleoedd eto, mae angen i gael gyfarwydd â'r cysyniad o Daflenni Arddull Rhaeadrol. Yn wir, mae'r rhain yn y rheolau ar gyfer fformatio, prosesu, sy'n cael eu cymhwyso i wahanol elfennau ar y tudalennau o wefan. Os byddwn yn disgrifio priodweddau elfennau yn HTML safonol, bydd yn rhaid i chi ailadrodd hyn sawl gwaith, byddwch yn cael dyblygu o un darn o god. Bydd dudalen amser llwyth ar gyfrifiadur y defnyddiwr dyfu. Er mwyn osgoi hyn, mae CSS. Mae'n suffices i ddisgrifio dim ond unwaith yn elfen benodol, ac yna dim ond nodi lle i ddefnyddio priodweddau arddull arbennig. Mae'n bosibl gwneud y disgrifiad o'r nid yn unig testun y dudalen ei hun, ond hefyd mewn ffeil arall. Bydd hyn yn caniatáu i wneud cais y disgrifiad o'r gwahanol arddulliau ar bob tudalen o'r safle. Mae hefyd yn gyfleus i addasu rhai tudalennau, addasu y CSS-ffeil. dalennau arddull yn eich galluogi i weithio gyda ffontiau ar lefel well na'r HTML, gan helpu i osgoi gwaethygu tudalennau graffeg y safle.

Defnyddio Taflenni Arddull ar gyfer datblygu bwydlenni

CSS cod ar gyfer y fwydlen:

1. # My_1menu {rhestr-arddull: dim; padin: 6; lled: 800px; ymyl: auto;}
2. # My_1menu li {float: chwith; ffont: Arial 18px italig;}
3. # My_1menu a {lliw: # 756; arddangos: bloc; uchder: 55px; llinell-uchder: 55px; padin: 0px 0px 15px 15px; cefndir: #dfc; testun-addurn: dim;}
4. # My_1menu yn: hofran {lliw: #foa; cefndir: # 788;}

Nawr, gadewch i ni edrych ar y ddewislen CSS llorweddol o ganlyniad.

# My_1menu - felly mae aseiniad arddull ar gyfer elfen ul-gyda id = my_1menu, rhestr-arddull: dim - gorchymyn hwn i gael gwared ar y marciau a adawyd gan yr eitemau a drefnwyd.

lled: 800px - lled ein bwydlen yn 800 picsel.

padin: 0 - mae hyn yn cael gwared ar y padin y tu mewn.

ymyl: auto - vyravnivnie ddewislen llorweddol yng nghanol ein tudalen.

# My_1menu li - aseinio arddulliau li-elfen.

uchder: 55px - uchder fwydlen.

# My_1menu yn: hofran - aseinio arddulliau i elfen a llygoden pan gaiff ei achosir.

Ni fyddwn yn disgrifio'n fanwl bob llinell, fel y gall pob datblygwr nodi ei paramedrau yma. Mae hyn yn sail ar gyfer y defnydd o arddulliau yn y ddewislen ar y wefan. Gallwch roi golwg mwy gorffenedig a hardd iddo, gan ddefnyddio lluniau. Neilltuo elfen ond, er enghraifft, cefndir: url (img1.png) ailadrodd-x. Bydded cefndir: url (img2.png) ail-x ar gyfer: hofran.

Defnyddiwch eich dychymyg, dewisiadau creadigol. Yna, yn seiliedig ar y wybodaeth ar sut i greu bwydlen syml ar y wefan, gallwch ddatblygu tudalen gyda'i ddyluniad unigryw ei hun.