Hvernig CSS þríhyrningsins: the þægilegur lifnaðarhættir

Mjög oft falleg nútímaleg vefsíðum innihalda margar aðlaðandi grafík. Meðal þeirra einföldustu not svo formi sem er sem þríhyrning, sem er notað til að hanna Qölda af þáttum. Til dæmis, þeir eru notaðir sem bendill á hlut á síðunni til að gesturinn snéri sér að honum. Að sjálfsögðu helsta hlutverk þríhyrningi - skreytingar, eins blokkir sem innihalda þau, eru að verða nútímalegri og aðlaðandi.

Ekki allir vita hvernig á að búa til svona mynd með Cascading Style Sheets, og ert að spá hvernig á að gera þríhyrning CSS.

Umsókn í hönnun vefsvæðum

Í vefhönnun þríhyrninga alls staðar. Þau eru gerð úr ábendingar, valmyndir, ýmsar UI frumefni. Stundum eru þau notuð til að búa til vísi á stígvél aðferð. Og ef fyrr var hægt að gera án þeirra, en nú er það ómögulegt, og verktaki er skylt að laga sig að slíkum kröfum. Eftir allt saman, í dag búin í CSS þríhyrningur - mikilvægur þáttur í byggingu samtengingu milli hlutar tengi og sameinast í eina heild.

Margir vefur hönnuður eru ráðalausir þegar kemur að útlitinu, hönnun sem er mjög oft þríhyrninga. Eftir allt saman, engin eiginleika sem myndi beint að búa til þessa geometrísk mynd. Í raun, það eru margar aðferðir til að gera þetta.

Aðferð við að búa til ramma með

The fyrstur aðferð leyfir þér að búa til þríhyrning í CSS - landamæri. Hann er að nota ramma. Þrátt fyrir að mörkin sem eru búin til með landamæri eign á ekki í beinum tengslum við þríhyrninginn, það er notað oftast í þessum tilgangi.

Þegar setja núll hæð og breidd á hlut, auk uppsetningu á þykkt rammans getur þú séð veldi, sem er skipt í fjóra jafnstóra þríhyrninga. The bragð er að þú þarft að halda aðeins nauðsynlegar landamæri, og hinir að gera gegnsætt. Og nú kemur það út þríhyrning dregin í CSS rétta átt og lita.

Búa horn með aðstoð Eiginleika "ramma" sem er þægilegt vegna þess að það er engin þörf á að teikna myndir með hvaða klippingu. þríhyrningur breytur er alltaf hægt að breyta í kóðanum. Og það sparar tíma verktaki. Með því að sameina mismunandi breidd ramma það er auðvelt nóg til að fá mynd. Til að skilja hvernig það virkar, getur þú einfaldlega að búa til tóman þáttur með núll breidd, hæð og mjög þykkur ramma mismunandi lit á hverri hlið. Svo, gera þrjár hliðar af fjórum gagnsæ þríhyrninga eru af ýmsum gerðum:

• þríhyrningur, leita til vinstri, sem eru aðilar jafnir;
• þríhyrningur, útlit vinstri og fletja;
• lengja þríhyrningur, vísa til vinstri;
• rétthyrndan þríhyrning, sem vinstri til hægri horn;
• þríhyrningur leita niður á við;
• þríhyrningur leita upp;
• þríhyrningur, leita til hægri, og mörgum öðrum tegundum.

notkun psevdoedementov

Með þessum aðferðum, getur þú búið til horn í pop-upp leiðbeiningar og ábendingar. Til að hengja gegnum CSS þríhyrningur til eining, aðallega forritarar nota, svo sem gervi-eftir og áður. Ef þú notar þá saman, það er hægt að draga í CSS þríhyrning heilablóðfalli.

Með því að sameina þá, verktaki búa til margs konar fallegum skotleikur, beita eign stöðu: hlutfallslegt til foreldris frumefni. Þetta er gert til þess að gervi-ekki flutt úr sætum sínum.

Auk notkun CSS ramma til að búa til þríhyrninga eru:

• fljótlegt og auðvelt útgáfa af stærðum og litum með hjálp eiginleika;
• styðja alla vafra.

gallar:

• vegna þess að það notar ramma, það er enginn möguleiki á að sækja um blöndun, skuggar;
• Stundum, þegar notandi lítur á síðuna í Firefox vafra, alfa gildi má ekki vinna, og þetta mun raska myndina.

Með tilbúnum myndum

Eftirfarandi aðferð við að búa til þríhyrninga - er að nota kóðuð myndum. Þríhyrningurinn er vakin fyrirfram í myndaforriti og breytt í sérstakt númer með sérhæfða þjónustu.

Kosturinn við þessa aðferð er að þú getur gert mjög fallega hönnun með skuggum, blöndun og ramma og þá bara umrita það allt. En hæðir er sú staðreynd að ekki allir eru altalandi á myndvinnsluforrit. Þar að auki, ef myndin er mjög stór, the lína af kóða er fengin með því einfaldlega gríðarlegur. Þetta er óþægilegur fyrir framkvæmdaraðila.

Sérstakur liður þess virði að nota vafra Internert Explorer gömlum útgáfum. Í þeim er aðferðin einfaldlega virkar ekki.

Method á hvolfi veldi

Ein leiðin er að búa til leið til CSS hvolfi torginu. Það eru tveir helstu eining. En sumir nota gervi.

Í fyrsta lagi, þú búa til ferning. Það mun vera innihald snúningur félagi. Síðan senda það með 45 gráður, þannig að það leit út eins og demantur. Næst, breyting upp og utanáliggjandi einingu falinn af hótelinu flæða: falinn. Þessi lausn er heldur ekki kross-vafranum, og stundum myndin birtist ekki sem óskað er.

Niðurstöður

Svo það eru margar aðferðir til að búa til þríhyrning. Bara það er ekki að villast í öllum þessum CSS eiginleika? Tilvísun í þessu tilfelli mun alltaf hjálpa. Það lýsir alla eiginleika af Cascading Style Sheets.

Fyrir þá sem vilja ekki að fara í forritun og skoða CSS-handbók, það eru online ritstjórar sem framkalla þríhyrningar rétta stærðum og litum. Í sjón ritstjóri, sem notandinn velur og stillir allt stillingar mynd. Breytt í CSS kóða rafall þríhyrninginn sett í aðskildum glugga á flugu. Þá mynda númer er einfaldlega sett inn í stílsíðu og til að passa hönnun á síðunni.