Kaip Padaryti Guminį Dangtelį

Turinys:

Kaip Padaryti Guminį Dangtelį
Kaip Padaryti Guminį Dangtelį

Video: Kaip Padaryti Guminį Dangtelį

Video: Kaip Padaryti Guminį Dangtelį
Video: JEI ŽINOTE ŠIĄ PASLAPTĮ, NIEKADA neišmeskite plastikinio butelio! Puikios pasidaryk pats idėjos! 2024, Gegužė
Anonim

Viršutinė svetainės dalis, kuri taip pat vadinama antrašte, paprastai atspindi ištekliaus temą ir joje gali būti naršymo juosta. Jei svetainės antraštė turi tam tikrą plotį, tada skirtingos skiriamosios gebos vartotojų ekranuose ši svetainės dalis atrodys kitaip. Norint, kad svetainės antraštė bet kuriame ekrane atrodytų vienodai, būtina, kad kai kurios jos dalys būtų ištemptos arba susitrauktų, atsižvelgiant į ekrano dydį. Tokį guminį dangtelį galima pagaminti nefiksuojant jo pločio pikseliais.

Kaip padaryti guminį dangtelį
Kaip padaryti guminį dangtelį

Būtinas

turėti savo svetainę

Nurodymai

1 žingsnis

Norėdami pagaminti guminį dangtelį, pirmiausia atkreipkite jį į „Photoshop“. Tada atskirkite 3 paveikslėlio dalis: 2 šonus ir vidurį. Šie gabalai turėtų būti apie 10–20 pikselių pločio ir apie norimo antraštės aukštį. Išsaugokite kiekvieną elementą taip, kad turėtumėte 3 skirtingus failus: 1.gif, 2.gif, 3.gif. Pateikite šiuos vaizdus svetainėje.

2 žingsnis

Tada sukurkite lentelę, kurioje bus elementai svetainės viršuje. Norėdami tai padaryti, parašykite HTML kodą:

100% pločio lentelė ištemps arba sumažės, priklausomai nuo vartotojo ekrano dydžio.

3 žingsnis

Lentelėje padarykite eilutę, kurios langelyje padėkite kairę 1

4 žingsnis

Sukurkite vidurinę svetainės antraštės dalį, susidedančią iš besikartojančio 2

.header {background-image: url ('images / 2.gif');}

5 žingsnis

Dabar lentelės eilutėje sukurkite kitą langelį ir įdėkite į jį vidurinį svetainės viršaus elementą, nurodydami jo pavadinimo antraštę CSS kode:

Svetainės pavadinimas

>

6 žingsnis

Sukūrę trečią langelį lentelės eilutėje, šioje ląstelėje įdėkite dešiniąją 3

Svetainės pavadinimas

Rekomenduojamas: