Hogyan működik a HTML5 adat attribútumokat, és hogyan lehet őket használni

Mi van egy adat-attribútumok és mire valók?

Tehát, először is, mi ez egyáltalán. Mint Ön is tudja, minden html tag, megadhatja az összes olyan attribútum, legyen az egyetemes (osztály, id), vagy egyedi az adott elem.

Az első funkció, hogy az attribútum neve lehet bármi. Az egyetlen szabály - meg kell előtaggal kezdődnek adat- és ott, persze, ne legyen a magyar betűk. Egy tag lehet írni tetszőleges számú paramétert. Csakúgy, mint az értékek megadhat tetszőleges szó. By the way, az érték is megadható az orosz. például:

Mint látható, bármelyiket megadhatja nevét és bármilyen érték. De ezek a lehetőségek nem csinál semmit egy ilyen elem, akkor miért van szükség? Van legalább egy pár módon lehet használni adat-attribútumok site épület, és nézzük meg őket.

HTML5 és CSS3 gyakorlatban nulla az eredmény!

Adagoló 1 - fellebbezést elemek css

Ha tudod, mi attribútum szelektor, akkor valószínűleg már hiszem, hogy az új funkciók is használhatók. Mutatva, hogy egy egyedi címkét adat-attribútum, akkor helyesen utal ez a stílus. Nézzünk egy példát:

Ez lehetővé tette számunkra, hogy alkalmazni kell az elem használata nélkül stílus osztályok. Azonban, ha úgy gondolja, igen, akkor nincs különösebb előnye, hogy nem, hogy hozzáférjen a class kell tenni ugyanazt a műveletet. Így egyszerűen lehetőségeinek bővítése céljából kapcsolók és semmi több.

Alkalmazási eljárás 2 - értékek tárolására és azok használatáról

Első pillantásra adat attribútum értékek nem változnak semmit, és általában nem befolyásolja a weboldalt. Tehát miért van szükségük? Tény, hogy azok felhasználásával lehetett találni, ha emlékszel a attr () függvény css.

Nézzük jelentenek a problémát: azt szeretnénk, hogy az oldalon megjelenő magyarázó szöveget fotók jelentek meg közvetlenül a képek, vagy ha felett lebeg, nem számít, hogyan. Normál csipetnyi alkalmazásával hajtják végre a cím attribútummal.

De ez a csúcs nem felel meg, az sok tényezőtől. Először is, úgy tűnik, sima (ami nem mindig szükséges). Másodszor, egy idő után eltűnik. Harmadszor, úgy tűnik, különböző helyeken, attól függően, hogy hol a kurzor. De a legnagyobb probléma - nem tudjuk stilizálhatja mi gyors - ez mindig fekete szöveg fehér alapon, ami nem túl érdekes.

Tehát a fenti kódot, már ki egy képet, hegyes a hozzá vezető utat, és ezen felül felvett tetszőleges adat-készlet. Végre egy következtetés magyarázata a képek most a következő:

Mit tettünk? Most az összes kép lesz pszeudoelem, amely tartalmazni fogja az érték az attribútum-img, ha ez az img tag. Ebben az egyszerű módon hozhat magyarázó szöveget fotókat.

Nem fogok ebben a cikkben leírja, hogyan kell felhívni a célzást. Csak azt tudom mondani, hogy alapértelmezés szerint akkor jelenik meg, ha az oldal betöltődik. Gyakran van szükség, hogy kezdetben elrejteni és megjeleníteni, ha lebeg a képen. Hajtják végre, akkor kell használni egy választó img: hover: miután.

Természetesen, az egyetlen hátránya, mindezen újítások az, hogy nem mindig megfelelően karbantartott. Tehát ha egy böngésző új funkciók jól működnek, és a felhasználók használhatják az új területen, majd egy másik böngészőben, minden más lehet. Természetesen részben lehet hibáztatni maguk a felhasználók, akik nem frissíti a szoftvert, de azt is meg kell nyomon követni, hogy mit és hogyan támogatják. A prémium során HTML5 csak képes megtanulni a jó szolgáltatás, amely meghatározza a támogatás bizonyos tulajdonságait.

egyszerűsített szintaxis

Nem tudok említeni, hogy hogyan kell helyesen felvenni a tulajdonságokat és azok értékeit. A tény az, hogy a HTML 5 ez a terv sokkal könnyebb lett. Elég, ha a pont. és lehetséges, hogy írjon kódot még kisebb hibák, és ennek eredményeként ő továbbra is helyesen feldolgozni. példák:

Úgy tűnik, mi ez? Lehetséges, hogy írni is? Kiderült, hogy a HTML5 lehetséges. Az attribútum értéke megadható idézőjelek nélkül, és maguk írni a nevét a címkék is különböző nyilvántartásokban. Persze, akkor nem szándékosan csináltam, és ebben az értelemben nem látható. De mégis, ha most véletlenszerűen valahol bevallani egy ilyen kis hiba, nem probléma merül fel.

HTML5 és CSS3 gyakorlatban nulla az eredmény!

A legtöbb IT hírek és webfejlesztés A csatorna-távirat