Kuidas CSS kolmnurga: mugaval viisil

Väga sageli ilus kaasaegne veebilehti sisaldavad palju atraktiivseid graafika. Neist lihtsaim kasutab sellist geomeetriline kuju nagu kolmnurk, mida kasutatakse projekteerimise elementide paljusust. Näiteks kasutatakse neid viit objekti lehel külastaja pööras tähelepanu temale. Muidugi põhiülesanne kolmnurga - dekoratiivne, kui plokid, mis sisaldavad neid, on muutumas üha kaasaegne ja atraktiivne.

Mitte igaüks teab, kuidas luua selline näitaja kaudu kaskaadlaadistiku ja ei tea, kuidas teha kolmnurk CSS.

Application projekteerimise saidid

Web Design kolmnurgad kõikjal. Nad on valmistatud vihjeid, menüüd, erinevate kasutajaliidese elemendid. Mõnikord kasutatakse neid luua näitaja boot protsessi. Ja kui varem oli võimalik teha ilma nendeta, kuid nüüd on võimatu, ja arendajad on kohustatud kohandama selliseid nõudeid. Lõppude lõpuks, täna loodud CSS kolmnurga - oluline osa vastastikuse seotuse osad liides ja ühendada üheks tervikuks.

Paljud veebidisainerid on hämmingus, kui tegemist on paigutus, mille konstruktsioon on väga sageli kolmnurgad. Lõppude lõpuks ei ole omadusi, mis otseselt luua selle geomeetriline kujund. Tegelikult on mitu meetodid seda teha.

Meetod luues raami lehe

Esimene meetod võimaldab teil luua kolmnurk CSS - piiri. Ta kasutab raame. Vaatamata sellele, et piirid, mis on loodud kasutades piiri vara ei ole otseselt seotud kolmnurga seda kasutatakse enamasti selleks.

Seadmisel null kõrgus ja laius objekti, samuti paigaldamise paks piiri, näed ruudu, mis on jagatud neljaks võrdseks kolmnurgaks. Trikk on selles, et teil on vaja hoida ainult vajalikud piiri ning teised teha läbipaistvaks. Ja nüüd selgub, kolmnurk tõmmatud CSS õiges suunas ja värvi.

Loo nurkade abil omadused "raam" on mugav, sest puudub vajadus joonistada, kasutades mis tahes toimetamine. kolmnurga parameetreid saab alati muuta koodi. Ja see säästab aega arendaja. Kombineerides erinevaid raami laius on piisavalt lihtne, et saada kuju. Et mõista, kuidas see toimib, saate lihtsalt luua tühja element null laius, kõrgus ja väga paksude raamidega erinevat värvi mõlemal küljel. Niisiis, muutes kolmest küljest nelja läbipaistev kolmnurgad on eri tüüpi:

• kolmnurk, otsin vasakule, mille küljed on võrdsed;
• kolmnurk, otsin vasakule ja lapik;
• pikliku kolmnurga suunaga vasakule;
• angled kolmnurk, mille vasakult paremale nurga;
• kolmnurga otsivad allapoole;
• kolmnurga soojaks;
• kolmnurk, otsin paremale, ja paljud teised liigid.

kasutades psevdoedementov

Nende tehnikate abil saate luua nurga pop-up juhiseid ja nõuandeid. Selleks, et lisada CSS-i kaudu kolmnurga üksus, enamasti programmeerijad kasutavad näiteks pseudo-pärast ja enne. Kui te kasutate neid koos, on võimalik juhtida CSS kolmnurga insuldi riski.

Kombineerides neid, arendajad luua erinevaid ilus shooter, kohaldades vara asukoht: sugulane vanemale element. Seda tehakse selleks, et pseudo-ei nihkusid oma istekohta.

Plus kasutamise CSS raamistiku loomiseks kolmnurgad on:

• kiire ja lihtne toimetamine suurused ja värvid abiga omadused;
• toetada kõigi brauseritega.

miinuseid:

• sest ta kasutab raami, ei ole võimalik taotleda kalded, varjud;
• mõnikord, kui kasutaja vaatab lehe Firefoxi brauserit, alfa väärtus ei tööta, ja see moonutab pilti.

Kasutades valmis pilte

Järgmised loomise meetodit kolmnurgad - on kasutada kodeeritud pilte. Kolmnurk on koostatud eelnevalt pilt toimetaja ja ümber spetsiaalne kood spetsialiseerunud teenuseid.

Selle meetodi eeliseks on see, et saate teha väga ilus disain varjud, kallete ning raami ja siis lihtsalt kodeerida see kõik. Aga negatiivne külg on see, et kõik ei ole valdavad graafika programmid. Lisaks, kui pilt on väga suur, koodirida saadakse lihtsalt tohutu. See on ebamugav arendaja.

Eraldi kirje väärt kasutamist brauserid internetist Explorer vana versiooni. Neis meetod lihtsalt ei tööta.

Meetod tagurpidi ruudu

Üks võimalus on luua vahendid CSS tagurpidi ruut. On kaks põhiüksus. Aga mõned inimesed kasutavad pseudo.

Esiteks loote ruut. See on sisu pöörleva liige. Siis juurutada seda 45 kraadi, nii et see nägi välja nagu teemant. Järgmisena nihe-up ja välise seadme peidetud vara ülevoog peidetud. See lahendus ka ei ole piiriülese brauser, ja mõnikord pildil ei kuvata soovitud.

tulemused

Niisiis, seal on palju meetodeid, et luua kolmnurga. Ainult see ei kao kõik need CSS omadused? Viide sel juhul alati aidata. See kirjeldab kõiki funktsioone kaskaadlaadistiku.

Neile, kes ei taha minna programmeerimine ja vaadata CSS-juhend on Internetis toimetajad, et genereerida kolmnurgad õige suuruse ja värvi. In visuaalne redaktor, kasutaja valib ja seadistab kõik seaded joonis. Konverteeritud CSS koodi generaator kolmnurga paigutatakse eraldi aknas lennult. Seejärel genereeritakse kood on lihtsalt sisestatud laaditabeli kasutamine ning sobivad disaini lehel.