A HTML elemeknek lehetnek attribútumai, amelyek további információkat tartalmaznak az elemről.

A HTML attribútumok általában név-érték párokban érkeznek, és mindig egy elem nyitó címkéjébe kerülnek. Az attribútum neve megmondja, hogy milyen típusú információt ad meg az elemről, és az attribútum értéke a tényleges információ.

Például egy horgony ( ) elem egy HTML dokumentumban hivatkozásokat hoz létre más oldalakra vagy az oldal más részeire. A hrefkezdő címkében található attribútum segítségével megadhatja a böngészőnek, hová továbbítja a link a felhasználót.

Íme egy példa egy linkre, amely a felhasználókat a freeCodeCamp kezdőlapjára irányítja:

Click here to go to freeCodeCamp!

Vegye figyelembe, hogy az attribútum neve ( href) és értéke („www.freeCodeCamp.org”) egyenlőségjelekkel vannak elválasztva, és idézőjelek veszik körül az értéket.

Sokféle HTML attribútum létezik, de a legtöbbjük csak bizonyos HTML elemeken működik. Például az hrefattribútum nem fog működni, ha egy nyílásba helyezik

címke.

A fenti példában az hrefattribútumhoz megadott érték bármilyen érvényes link lehet. Egyes attribútumok azonban csak érvényes opciókat tartalmaznak, amelyeket használhat, vagy az értékeknek meghatározott formátumban kell lenniük. Az langattribútum megmondja a böngészőnek a HTML elem tartalmának alapértelmezett nyelvét. Az langattribútum értékeinek szabványos nyelvi vagy országkódokat kell használniuk, például enangolul vagy itolaszul.

Logikai attribútumok

Egyes HTML-attribútumoknak nincs szükségük értékre, mert csak egy lehetőségük van. Ezeket logikai attribútumoknak nevezzük. Az attribútum jelenléte egy címkében alkalmazza azt a HTML elemre. Azonban rendben van, ha kiírja az attribútum nevét, és megegyezik az érték egy opciójával. Ebben az esetben az érték általában megegyezik az attribútum nevével.

Például az űrlap elemének lehet requiredattribútuma. Ehhez a felhasználóknak ki kell töltenie az elemet, mielőtt elküldenék az űrlapot.

Íme néhány példa, amelyek ugyanazt teszik:

A,, src és a roll attribútumokról itt olvashat bővebben:

Tulajdonság

src Attribútum

roll Attribútum

Tulajdonság

Most ismerkedj meg néhány egyéb HTML-attribútummal:

P Igazítsa az attribútumot

Fontos

Ezt az attribútumot a HTML5 nem támogatja. Javasoljuk a text-alignCSS tulajdonság használatát.

A szöveg igazítása a

Syntax

Lorem Ipsum...

Attributes

• left - Text aligns to the left
• right - Text aligns to the right
• center - Text aligns to the center
• justify - All lines of text have equal width

Example

Paragraph align attribute example

Img Src Attribute

The attribute refers to the source of the image you want to display. The img tag will not display an image without the src attribute. However, if you set the source to the location of the image, you can display any image.

There is an image of the freeCodeCamp Logo located at //avatars0.githubusercontent.com/u/9892522?v=4&s=400

You can set that as the image using the src attribute.

 Img Src Attribute Example 

The above code displays like this:

The src attribute is supported by all browsers.

You can also have a locally hosted file as your image.

For example, Change my color

function redify(){ let text = document.querySelector('#text'); text.style.color = "red"; }

Using raw JavaScript onclick attribute:

Hello World

Img Align Attribute

The align attribute of an image specifies where the image should be aligned according to the surrounding element.

Attribute Values:

right - Align image to the right left - Align image to the left

top - Align image to the top

bottom - Align image to the bottom

middle - Align image to the middle

For example:

 Img Align Attribute 
This is an example. More text right here 

Akkor is igazodhatunk, ha akarjuk:

This is another example

Felhívjuk figyelmét, hogy az align attribútum nem támogatott a HTML5-ben, ezért inkább CSS-t kell használnia. Ezt azonban továbbra is az összes nagy böngésző támogatja.

Beviteltípus attribútum

A input type attribútum határozza meg a felhasználó által az űrlapba beírandó input típusát.

szöveg

Egy szöveg egy sora.

  Login:  

Jelszó

A szöveg egy sora. A szöveg automatikusan pontok vagy csillagok sorozataként jelenik meg (a böngészőtől és az operációs rendszertől függ).

  Password:  

email

A HTML ellenőrzi, hogy a bemenet megfelel-e az e-mail cím formátumának (valami @ valami).

  E-mail address:  

szám

Csak numerikus bevitelt engedélyezzen. Megadhatja a megengedett min és max értéket is. Az alábbi példa ellenőrzi, hogy a bemenet száma 1 és 120 között van-e.

  Age:  

rádió

Csak egy lehetőséget választhat ki a felhasználó. A választógombok csoportjának azonos névjellemzővel kell rendelkeznie. Automatikusan kiválaszthat egy lehetőséget a checkedtulajdonság használatával (például a Kék érték alatt van kiválasztva).

  Red Green Blue 

jelölőnégyzetet

A felhasználó nulla vagy több lehetőséget választhat a jelölőnégyzetek csoportjából. Az checkedingatlan itt is használható egy vagy több lehetőséghez.

  english spanish french 

gomb

A bemenet gombként jelenik meg, a gombban megjelenítendő szöveg értékattribútumban van.

Beküldés

Megjeleníti a beküldés gombot. A gombban megjelenítendő szöveg értékattribútumban van. A gombra kattintás után a HTML elvégzi az ellenőrzést, és ha ez átmegy, beküldik az űrlapot.

Visszaállítás

Megjeleníti a reset gombot. A gombban megjelenítendő szöveg értékattribútumban van. A gombra kattintás után az űrlap összes értéke törlődik.

Több típusú elem van.

Egyéb HTML-attribútumok:

src attribútum

roll attribútum

tulajdonság

tulajdonság