HTML中<input>標(biāo)簽的class屬性的值及其使用方法總結(jié)
發(fā)表時(shí)間：2023-09-03 來(lái)源：明輝站整理相關(guān)軟件相關(guān)文章人氣：
[摘要]本篇文章主要為大家介紹了關(guān)于HTML中input標(biāo)簽的class屬性的具體作用，都有實(shí)例證明，還有input標(biāo)簽的class屬性和屬性值的使用方法解釋，最后一點(diǎn)是關(guān)于class屬性的一個(gè)其它用法實(shí)例。首先呢，我們來(lái)說(shuō)說(shuō)HTML中input標(biāo)簽的class屬性的作用：input標(biāo)簽的class屬性是...
本篇文章主要為大家介紹了關(guān)于HTML中input標(biāo)簽的class屬性的具體作用，都有實(shí)例證明，還有input標(biāo)簽的class屬性和屬性值的使用方法解釋，最后一點(diǎn)是關(guān)于class屬性的一個(gè)其它用法實(shí)例。
首先呢，我們來(lái)說(shuō)說(shuō)HTML中input標(biāo)簽的class屬性的作用：
input標(biāo)簽的class屬性是用來(lái)引用你頁(yè)面的類樣式。
即你先在<style type="text/css"></style>標(biāo)簽內(nèi)定義一個(gè)類樣式，然后再來(lái)引用它。
像這樣：
<style type="text/css">
.btn{
color:red;
}
</style>
<input type="button" class="btn" />頁(yè)面的效果就不顯示了，反正就是把這個(gè)按鈕上的文字顏色是紅色了。有興趣的可以自己動(dòng)手試試。
下面說(shuō)說(shuō)具體的input標(biāo)簽的class屬性和屬性的值的使用方法解釋：
classname屬性。a標(biāo)簽中class屬性，供添加樣式用，相關(guān)概念有class及映射classname、classlist這3個(gè)。
一般來(lái)說(shuō)，所有屬性都可以object、object[""]及object.getAttribute("")來(lái)訪問(wèn)的，但因class屬于JavaScript保留字，故將其映射為classname來(lái)供上述方案訪問(wèn)。所以標(biāo)準(zhǔn)瀏覽器都支持：a.classname和a["classname"]這2個(gè)辦法的訪問(wèn)。
至于a.getattribute("class")還是a.getattribute("classname")則需看瀏覽器是否兼容這個(gè)方法的訪問(wèn)了。（待考：前者能在mozilla(firefox)和opera中正確運(yùn)行，在IE和safari中則不能使用。后者能在IE和opera中正確運(yùn)行，在mozilla(firefox)和safari中則不能使用。）
但DOM2級(jí)方法object.getattribute("")，用來(lái)獲取標(biāo)簽內(nèi)的自定義屬性是沒(méi)問(wèn)題的，所以一個(gè)保守的做法是
classList屬性。因?yàn)閏lass屬性的值可以包含若干個(gè)樣式名，如class="top1 left",這個(gè)字符串性質(zhì)的值經(jīng)常需要我們操作，classname完成class的了映射，但操作class屬性的值時(shí)卻顯得僵硬的很。怎么辦，HTML5 新增API之classlist能解決這個(gè)問(wèn)題。
classlist屬性又是對(duì)classname的一個(gè)改進(jìn)，就像我們見(jiàn)到的arguments屬性、childnode屬性一樣，可以理解為一個(gè)類數(shù)組對(duì)象。（仍然待考哈）
classlist帶來(lái)了一些操作方法和屬性：add( ), remove( ),toggle( ),contains( )等及l(fā)ength。
可以用a.classList或者a["classList"]辦法訪問(wèn)，a.getAttribute("classList")仍然存在瀏覽器兼容問(wèn)題。
class屬性除了在用于input標(biāo)簽里面，還有其他的方向，比如下面這個(gè)：
在 HTML 文檔中使用 class 屬性實(shí)例：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>
<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>這里是注釋：
class 屬性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
可以給 HTML 元素賦予多個(gè) class，例如：<span class="left_menu important">。這么做可以把若干個(gè) CSS 類合并到一個(gè) HTML 元素。
類名不能以數(shù)字開(kāi)頭！只有 Internet Explorer 支持這種做法。
【相關(guān)推薦】
HTML中head標(biāo)簽是什么意思？一篇文章教你正確地使用head標(biāo)簽
html表格中的th表頭內(nèi)容怎么居中？th表頭標(biāo)簽align屬性的具體介紹
以上就是HTML中<input>標(biāo)簽的class屬性的值及其使用方法總結(jié)的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！
網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語(yǔ)，涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。
