Rumah > Artikel > hujung hadapan web > Bagaimana untuk menetapkan atribut label dalam css
Bagaimana untuk menetapkan atribut label dalam css
- 藏色散人asal
- 2021-07-22 11:28:383239semak imbas
Cara untuk menetapkan atribut teg dalam css: mula-mula buat fail sampel HTML, kemudian tetapkan atribut untuk teg dengan menetapkan gaya pada teg html.
Persekitaran pengendalian artikel ini: sistem Windows 7, versi HTML5&&CSS3, komputer DELL G3
Bagaimana untuk menetapkan atribut label dalam css? Pemilih css menetapkan gaya label
pemilih css
Gaya tetapan pada teg html boleh menetapkan atribut untuk label:
<p style="background-color: #2459a2;height: 48px;">啊啊啊</p>
Kami juga boleh lulus
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
<!--在这里写选择器-->
</style>
</head>Terdapat banyak pemilih khusus:
1 oleh id
#i1{
background-color: #2459a2;
height: 48px;
}Tag dalam badan digunakan seperti ini: Tetapi anda tidak boleh menulis lebih daripada satu ID, jadi anda masih tidak boleh menggunakannya lebih daripada sekali
<p id="i1"></p>
<p id="i1"></p>但id不能写多个（不规范）2. Salin melalui kelas:
/*class选择器：用class=c1来就可以复制这个样式，同时避免了id必须统一的缺陷*/
.c1{
background-color: #2459a2;
height: 60px;
} Apabila digunakan:
<p class="c1">1251251</p>能写多个
<p class="c1">1251253</p>能写多个3 Pemilih teg: Tukar tag tertentu kepada gaya ini:
标签选择器：把所有的p标签变成黑底白字
p{
background-color: black;
color: white;
}4. . Pemilih tahap: Terdapat ruang di tengah
层级选择器：把span标签里p标签弄成这个样式
span p{
background-color: black;
color: white;
}
层级：把c1里c2里的p设置成这个样式
.c1 .c2 p{
background-color: black;
color: white;
}5 Pemilih gabungan: Terdapat koma di tengah
<style>
组合选择器：#或者.都可以实现组合
#i1,#i2,#i3{
background-color: black;
color: white;
}
.c5,.c6,.c7{
background-color: black;
color: white;
}
</style>6 🎜>
Kajian yang disyorkan: " <style>
/*属性选择器：把type='text'的设成这个样式*/
input[type='text']{
width: 100px;
height: 200px;
}
把自定义的n的值为s1的标签设置成这个样式
input[n='s1']{
width: 100px;
height: 200px;
}
</style>Tutorial video cssAtas ialah kandungan terperinci Bagaimana untuk menetapkan atribut label dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!