CSS属性选择符
属性选择符：
E[att] 选择具有att属性的E元素。
<style type="text/css">
a[class]{ background-color: red;}
</style>
<body>
<a href="" class="a">链接a</a>
<a href="" id="b">链接b</a>
</body>
E[att="val"] 选择具有att属性且属性值等于valu的E元素。
<style type="text/css">
a[class="1"]{ background-color: red;}
</style>
<body>
<a href="" class="1">链接a</a>
<a href="" class="2">链接b</a>
</body>
E[att~="val"] 选择具有att属性且属性值为一用空格分隔的字词列表，其中一个等于val的E元素。
<style>
a[class~="id"]{color: red;}
</style>
<body>
<ul>
<li><a href="" class="id 1">链接a</a></li>
<li><a href="" class="1">链接b</a></li>
<li><a href="" class="1">链接b</a></li>
</body>
E[att^="val"] 选择具有att属性且属性值为以val开头的字符串的E元素。
<style>
a[title~=""]
{color:red;}
</style>
<body>
<a href="http://www.163.com/" title="www 163 com">红色</a>
<a href="http://www.baidu.com/" title="www baidu com">红色</a>
</body>
E[att$="val"] 选择具有att属性且属性值为以val结尾的字符串的E元素。
<style>
li[class$="a"] {color: #f00;}
</style>
</head>
<body>
<ul>
<li class="abc">列表项目</li>
<li class="acb">列表项目</li>
</ul>
</body>
E[att*="val"] 选择具有att属性且属性值为包含val的字符串的E元素。
<style type="text/css">
a[href*=".html"]{color:red;}
a[href*=".php"]{color:green;}
a[href*=".jsp"]{color:blue;}
</style>
<body>
<a href="http://www.dreamdu.com/css.html?id=1&name=www">梦之都红色字体</a>
<a href="http://www.dreamdu.com/css.php?id=2&name=dreamdu">梦之都绿色字体</a>
<a href="http://www.dreamdu.com/css.jsp?id=3&name=com">梦之都蓝色字体</a>
</body>
E[att|="val"] 选择具有att属性且属性值为以val开头并用连接符"-"分隔的字符串的E元素。
<style type="text/css">
a[title~="dreamdu"]{color:red;}
</style>
<body>
<a href="http://www.dreamdu.com/" title="www dreamdu com">红色</a>
</body>
font-family，font-size，font-weight，font-style
<style type="text/css">
p { font-family: "宋体";}
h1 { font-size:14px ;}
h2 { font-weight: normal ;}
h3 {font-style: italic;}
</style>
</head>
<body>
<p>这是一个标签</p>
<h1>这是一个标签</h1>
<h2>这是一个标签</h2>
<h3>这是一个标签</h3>
</body>
font(字体样式缩写)
<style type="text/css">
/*p{font-style:italic;
font-weight:bold;
font-size:14px;
line-height:22px;
font-family:宋体;}*/
p {font:italic bold 14px/22px 宋体}
</style>
</head>
<body>
<p>这是一个标签</p>
</body>
</html>
text-decoration(文本装饰线条)，text-shadow(文字阴影)
<style type="text/css">
p { text-decoration: underline;
text-shadow: 2px 2px #ff0000; }
</style>
</head>
<body>
<p>这是一个标签</p>
</body>
width，height
<style type="text/css">
p { width:300px;}
div { height:100px; padding: 1px; border:1px solid;}
</style>
</head>
<body>
<p>这是一个标签这是一个标签这是一个标签这是一个标签</p>
<div>这是一个标签</div>
</body>
CSS属性选择符的更多相关文章
- 强大的CSS 属性选择符 配合 stylish 屏蔽新浪微博信息流广告
新建一条微博域名下的规则: @-moz-document domain("weibo.com") { #v6_pl_rightmod_rank,#v6_pl_rightmod_ad ...
- #8.10.16总结# 属性选择符 伪对象选择符 CSS的常用样式
属性选择符 E[att] E[att="val"] E[att~="val"] E[att^="val"] E[att$="val ...
- css关系选择符
<!Doctype html> <html> <head> <meta http-equiv="Content-Type" content ...
- CSS3初学篇章_3（属性选择符/字体样式/元素样式）
属性选择符 选择符 说明 E[att] 选择具有att属性的E元素. E[att="val"] 选择具有att属性且属性值等于val的E元素. E[att~=&quo ...
- CSS 组合选择符
CSS 组合选择符 组合选择符说明了两个选择器直接的关系. CSS组合选择符包括各种简单选择符的组合方式. 在 CSS3 中包含了四种组合方式: 后代选取器(以空格分隔) 子元素选择器(以大于号分隔) ...
- CSS：CSS 组合选择符
ylbtech-CSS:CSS 组合选择符 1.返回顶部 1. CSS 组合选择符 CSS 组合选择符 组合选择符说明了两个选择器直接的关系. CSS组合选择符包括各种简单选择符的组合方式. 在 CS ...
- CSS高级选择符
2016-11-07 <css入门经典>第八章 1.属性选择器 选择器 描述 [attribute] 用于选取带有指定属性的元素. [attribute=value] 用于选取带有指定属性 ...
- CSS 的选择符
CSS是什么? 如果说元素是标记代码的构建块料,那么CSS就是约束这些构建块料样式的规则. CSS规则的组成 CSS的规则由 选择符 和属性,值组成. Css选择符:选择符是规则中用于确定样式所涵盖的 ...
- CSS之选择符、链接、盒子模型、显示隐藏元素
<html> <head> <meta charset="utf-8"> <title>选择符.链接.盒子模型.显示隐藏元素< ...
随机推荐
- 显示Class 'Think\Controller\FuController' not found和Call to a member function assign() on a non-object 的错误问题
Class 'Think\Controller\FuController' not found 错误位置 FILE: D:\wamp\www\tinkphp\Application\Come\Cont ...
- 115个Java面试题和答案——终极列表（上）
本文我们将要讨论Java面试中的各种不同类型的面试题,它们可以让雇主测试应聘者的Java和通用的面向对象编程的能力.下面的章节分为上下两篇,第一篇将要讨论面向对象编程和它的特点,关于Java和它的功能 ...
- 运行两个以上tomcat的设置及内存设置
运行两个或以上tomcat的设置方法 1.解决端口冲突问题设置方法很简单,修改conf/server.xml配置文件中的3个端口即可.默认端口:8005.8080.8009.一般情况位置如下:**** ...
- BW知识问答锦集2
PM面试分为BW.BO两部分,根据顾问的简历和应聘的岗位所侧重的问题不同. BW包括基础知识.增量.增强.LO抽取.数据源. BO包括 CR.CR.WEBI.UNI. 一. 基础知识 技术面试 1. ...
- TFS二次开发系列：八、TFS二次开发的数据统计以PBI、Bug、Sprint等为例(二)
上一篇文章我们编写了此例的DTO层,本文将数据访问层封装为逻辑层,提供给界面使用. 1.获取TFS Dto实例,并且可以获取项目集合,以及单独获取某个项目实体 public static TFSSer ...
- Virtualbox中不能为虚拟机打开一个新任务的原因及解决方法
VirtualBox新建虚拟机时报错,不能为虚拟机打开一个新任务的原因 解决办法如下 1.保证bios里的virtualization technology的选项开启,不同电脑BIOS设置可能会不一样 ...
- 一篇讲Java指令重排和内存可见性的好文
在这里: http://tech.meituan.com/java-memory-reordering.html 指令重排和内存可见性(缓存不一致)是两个不同的问题. volatile关键字太强,即阻 ...
- mysql事务处理
事务处理能保证所有的sql操作一次性完成或回滚,mysql默认的MyISAM表类型是不支持事务处理的,如果需要做事务处理,需要把表类型换成InnoDB <?php $dsn='mysql:hos ...
- C# 文件类型
C# 中一些常用文件类型: designer.cs 是窗体设计器生成的代码文件,作用是对窗体上的控件做初始化工作(在函数InitializeComponent()中).VS2003以前都把这部分代码放 ...
- jquery ajax 方法及各参数详解
1.$.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息. 参数列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type ...