首页 > 代码库 > CSS:属性选择器

CSS:属性选择器

本文介绍css中属性选择器的基本用法:为具备指定属性的标签设置样式。

代码整理自w3school:http://www.w3school.com.cn

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-cn" />

<title>属性选择器</title>
<!--对带有指定属性的 HTML 元素设置样式。-->

<head>
  <style>
    [title] {color:red}
    [type=W3School] {background-color:#afa}
    [userDefineType~=W3School] {background-color:#aaf}
    [userDefineType02|=W3School] {background-color:#aaf}
    div[userDefineType03=W3School] {background-color:#faa}
  </style>
</head>

<body>
  <h3>(一)所有带有title属性的html标签将显示为红色。</h3>
  <h4 title="title01">带有title属性的h4.</h4>
  <a title="title02" href=http://www.mamicode.com/"http://www.baidu.com">带有title属性的超链接.>效果图:


CSS:属性选择器