[CSS3]移动Web开发系列之CSS3增强型选择器
css3是移动Web开发的主要技术之中的一个。当前。CSS3技术最适合在移动Web开发中使用的特性有增强的选择器、阴影、强大的背景设置
、圆角边框
接下来我们主要解说增强型的选择器。主要分两种,属性选择器和伪类选择器
1、属性选择器
1.1全然匹配选择器
语法:[attribute=value]
<span style="font-family:Microsoft YaHei;"><div id="article">属性匹配选择器</div>
<style type="text/css">
[id=article]{
color:red;
}
</style></span>
1.2包括匹配选择器
语法:[attribute*=value]
<span style="font-family:Microsoft YaHei;"><div id="article">属性匹配选择器</div>
<div id="subarticle">属性匹配选择器</div>
<div id="article1">属性匹配选择器</div>
<style type="text/css">
[id*=article]{
color:red;
}
</style></span>
1.3首字符匹配选择器
语法:[attribute^=value]
<span style="font-family:Microsoft YaHei;"><div id="article">属性匹配选择器</div>
<div id="subarticle">属性匹配选择器</div>
<div id="article1">属性匹配选择器</div>
<style type="text/css">
[id^=article]{
color:red;
}
</style></span>
1.4尾字符匹配选择器
语法:[attribute$=value]
<span style="font-family:Microsoft YaHei;"><div id="article">属性匹配选择器</div>
<div id="subarticle">属性匹配选择器</div>
<div id="article1">属性匹配选择器</div>
<style type="text/css">
[id$=article]{
color:red;
}
</style></span>
2、伪类选择器
CSS3选择器中,伪类选择器种类许多,在CSS2.1时代。伪类选择已经存在。比如超链接的四个状态选择器
a:link、a:visited、a:hover、a:active
CSS3添加了许多的选择器,当中包含:
first-line 伪元素选择器
first-letter伪元素选择器
root选择器
not选择器
empty选择器
target选择器
[CSS3]移动Web开发系列之CSS3增强型选择器的更多相关文章
- [Python] 利用Django进行Web开发系列(二)
1 编写第一个静态页面——Hello world页面 在上一篇博客<[Python] 利用Django进行Web开发系列(一)>中,我们创建了自己的目录mysite. Step1:创建视图 ...
- [Python] 利用Django进行Web开发系列(一)
1 写在前面 在没有接触互联网这个行业的时候,我就一直很好奇网站是怎么构建的.现在虽然从事互联网相关的工作,但是也一直没有接触过Web开发之类的东西,但是兴趣终归还是要有的,而且是需要自己动手去实践的 ...
- 高性能Web开发系列
1. 高性能WEB开发基础 http://www.uml.org.cn/net/201404225.asp 2. 高性能WEB开发进阶(上) http://www.uml.org.cn/net/201 ...
- Python Web框架本质——Python Web开发系列一
前言:了解一件事情本质的那一瞬间总能让我获得巨大的愉悦感,希望这篇文章也能帮助到您. 目的:本文主要简单介绍Web开发中三大基本功能:Socket实现.路由系统.模板引擎渲染. 进入正题. 一. 基础 ...
- 【前端开发系列】—— CSS3属性选择器总结
想想自己为什么要学CSS,作为一个开发过前端的人员来说,调试一个图片花了半天的时间,最后发现分隔符用错了,实在是一件很丢人的事情.因此,痛下决心来学习CSS,最近一周也会更新下相关的学习笔记. CSS ...
- 【HTML5开发系列】CSS3
选择器 属性 背景和边框 盒模型 布局 文本 动画 其他
- Web开发系列【1】实用的网页布局(PC端)
在熟悉那些常用的软件.工具后,我们正式开始开发,在前期准备工作之后,我们要做的事情是写页面,也就是网页布局.在w3c.菜鸟.慕课网等等网站上都有基础的 HTML+CSS 知识讲解,在初期学习中,跟着教 ...
- 勤拂拭软件系列教程 - java web开发
勤拂拭软件工作室持续推出Java Web开发系列教程与案例,供广大朋友分享交流技术经验,帮助喜欢java的朋友们学习进步: 1. 勤拂拭软件 java web 开发教程(1) - 开发环境搭建 勤拂拭 ...
- 系列教程 - java web开发
代码之间工作室持续推出Java Web开发系列教程与案例,供广大朋友分享交流技术经验,帮助喜欢java的朋友们学习进步: java web 开发教程(1) - 开发环境搭建 技术交流QQ群: 商务合作 ...
随机推荐
- Java正则表达式--Matcher.group函数的用法
原来,group是针对()来说的,group(0)就是指的整个串,group(1) 指的是第一个括号里的东西,group(2)指的第二个括号里的东西. 最近学习正则表达式,发现Java中的一些术语与其 ...
- UVA 10652 Board Wrapping(二维凸包)
传送门 刘汝佳<算法竞赛入门经典>P272例题6包装木板 题意:有n块矩形木板,你的任务是用一个面积尽量小的凸多边形把它们抱起来,并计算出木板占整个包装面积的百分比. 输入:t组数据,每组 ...
- Java并发笔记(二)
1. 活跃性危险 死锁(最常见) 饥饿 当线程由于无法访问它所需的资源而不能继续执行时,就发生了饥饿.引发饥饿最常见资源就是CPU时钟周期. 活锁 活锁指的是任务或者执行者没有被阻塞,由于某些条件没有 ...
- Inline Hook
@author: dlive IAT Hook时如果要钩取的API不在IAT中(LoadLibrary后调用),则无法使用该技术.而Inline Hook不存在这个限制. 0x01 Inline Ho ...
- request_mem_region 与 ioremap【转】
转自:http://blog.csdn.net/alada007/article/details/7700125 如果从根本上说起的话应该从Intel的处理器芯片与其它的芯片的不同说起,与这两个函数相 ...
- 12.OpenStack镜像和存储服务配置
配置镜像服务 编辑 /etc/glance/glance-api.conf与/etc/glance/glance-registry.conf添加以下内容 [DEFAULT] notification_ ...
- 【linux高级程序设计】(第十二章)Linux多线程编程 4
读写锁 书上有读者写者的代码,我实在是懒得实现一遍了.跟之前的代码差不多. 多线程异步信号处理 int pthread_kill (pthread_t __threadid, int __signo) ...
- HDU 4920.Matrix multiplication-矩阵乘法
Matrix multiplication Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/ ...
- Codeforces Round #289 (Div. 2, ACM ICPC Rules) A. Maximum in Table【递推】
A. Maximum in Table time limit per test 2 seconds memory limit per test 256 megabytes input standard ...
- ACM入门指南
本文已经转移到了:http://harryguo.me/2015/11/03/ACM-%E5%85%A5%E9%97%A8%E6%8C%87%E5%8D%97/ 什么是ACM? 想必打开这篇博客的人已 ...