HTML屬性 - HTML

屬性用於提供有關元素的其他信息。

所有HTML元素都可以具有屬性。屬性提供有關元素的其他信息。
它帶有兩個參數：**名稱和值。**這些定義了元素的屬性，並放置在元素的開始標籤內。name參數採用我們要分配給元素的屬性的名稱，而值採用可以在元素上對齊的屬性值或屬性名稱的範圍。
每個名稱都有一些必須用引號引起來的值。

句法：

<element attribute_name =“ attribute_value”>

以下是HTML中最常用的一些屬性：

1. src屬性：

如果要將圖像插入網頁，則需要使用標籤和src屬性。我們需要將圖像的地址指定為雙引號內的屬性值。

<html> 
<head> 
    <title>src Attribute</title> 
</head> 
<body> 
    <img src="https://asset.1ju.org/cmsstatic/html-basics.png"> 
</body> 
</html>

輸出：
geek

2. alt Attribute

顧名思義，這是一個備用標記，如果主屬性（即<img>標記）無法顯示分配給它的值，則該標記用於顯示或顯示某些內容。這也可以用於向實際坐在編碼端的開發人員描述圖像。

<html> 
<head> 
    <title>alt Attribute</title> 
</head> 
<body> 
    <!--If the image is not found or the img field
     is left blank the alt value gets displayed-->
    <img src="https://asset.1ju.org/cmsstatic/html-basics.png" alt="The Logo"><br>



    <img src="" alt="Since the src value is blank,the alt value is displayed"> 
</body> 
</html>

輸出：
alt屬性

3. width和height屬性

此屬性用於調整圖像的寬度和高度。

<html> 
<head> 
    <title>Width and Height</title> 
</head> 
<body> 
    <img src="https://media.geeksforgeeks.org/wp-content/cdn-uploads/Geek_logi_-low_res.png" width="300px" height="100px" > 
</body> 
</html>

src屬性

4. id屬性

此屬性用於為元素提供唯一標識。當我們需要訪問一個名稱可能與其他名稱相似的特定元素時，可能會出現這種情況。在這種情況下，我們為各種元素提供不同的ID，以便可以唯一地訪問它們。擴展使用id的屬性通常在CSS中使用，我們將在後面學習。

<html> 
<head> 
    <title>id Attribute</title> 
</head> 
<body> 
    <p id = "GfG">Hello geeks<br>


    <p id = "ui">This is unique to this paragraph<br>


    <p id = "head">This is also unique to this paragraph 
</body> 
</html>

5. title屬性

title屬性用於說明將鼠標懸停在其上方的元素。行為因各種元素而異，但通常在將鼠標指針加載或懸停在其上時會顯示該值。
範例：

<html>
<head>
    <title>title Attribute</title>
</head>
<body>
    <h3 title="Hello GeeksforGeeks">Hover to see the effect</h3>
</body>
</html>

輸出：
title屬性

6. href屬性

此屬性用於指定到任何地址的鏈接。該屬性與標記一起使用。置於href屬性內的鏈接將鏈接到標記內顯示的文本。
單擊文本後，我們將被重定向到鏈接。默認情況下，該鏈接在同一標籤中打開，但是通過使用target屬性並將其值設置為“ _blank”，我們將根據瀏覽器配置重定向到另一個選項卡或另一個窗口。

<html> 
<head> 
    <title>link Attribute</title> 
</head> 
<body> 
    <a href="https://www.1ju.org/"> 
        Click to open in the same tab 
    </a><br>

    <a href="https://www.1ju.org/" target="_blank"> 
        Click to open in a different tab 
    </a> 
</body> 
</html>

輸出：

href屬性

7. style樣式屬性

此屬性用於為HTML元素提供各種CSS（級聯樣式表）效果，例如增加字體大小，更改字體系列，著色等。有關詳細說明，請參見HTML | CSS | CSS。樣式標籤。下面的程序顯示了伴有style屬性的一些名稱和值

<html> 
<head> 
    <title>style Attribute</title> 
</head> 
<body> 
    <h2 style="font-family:Chaparral Pro Light;">Hello GeeksforGeeks.</h2> 
    <h3 style="font-size:20px;">Hello GeeksforGeeks.</h3> 
    <h2 style="color:#8CCEF9;">Hello GeeksforGeeks.</h2> 
    <h2 style="text-align:center;">Hello GeeksforGeeks.</h2> 
</body> 
</html>

輸出：

style屬性

8. lang屬性

語言是使用lang屬性聲明的。聲明語言對於可訪問性應用程序和搜索引擎可能很重要。


<!DOCTYPE html> 
<html lang="en-US"> 
<body> 

... 

</body> 
</html>