Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch

E[attr]选择器

此选择器可以匹配具有指定属性的元素，而不管属性值。
代码实例如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://ask.php.cn/" />
<title>php中文网</title>
<style type="text/css">
li{
  list-style:none;
  float:left;
  height:20px;
  line-height:20px;
  width:20px;
  border:1px solid #333;
  border-radius:10px;
  border-radius:10px;
  border-radius:10px;
  text-align:center;
  color:green;
  margin-right:5px;
}
li[id]{
  color:red
}
</style>
</head>
<body>
<div class="antzone">
  <ul>
    <li>1</li>
    <li title="antzone" id="theid">2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
  </ul>
</div>
</body>
</html>

以上代码可以讲具有id属性的li元素中的字体颜色设置为红色。
也可以使用多个属性来匹配元素，代码如下:

li[id][title]{
  color:red
}

以上代码可以讲同时具有id和title属性的li元素中的字体设置为红色。


Weiter lernen
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://ask.php.cn/" /> <title>CSS教程</title> <style type="text/css"> li[class]{color:blue;} </style> </head> <body> <ul> <li class="html-zhuanqu">html专区</li> <li class="div css">DIV+CSS专区</li> <li id="js zhuanqu css">Javascript专区</li> <li id="css-zhuanqu">Jquery专区</li> </ul> </body> </html>
einreichenCode zurücksetzen
Vorherige Sektion nächsten Abschnitt
Tutorial-Liste
Hilfe bekommen
  • Kursempfehlungen
  • Kursunterlagen herunterladen
Die Kursunterlagen stehen derzeit nicht zum Download zur Verfügung. Die Mitarbeiter organisieren es derzeit. Bitte schenken Sie diesem Kurs in Zukunft mehr Aufmerksamkeit

Auch Studierende, die diesen Kurs gesehen haben, lernen

Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)  492817 spielt ab