css3是移动Web开发的主要技术之一。当前，CSS3技术最适合在移动Web开发中使用的特性有增强的选择器、阴影、强大的背景设置 、圆角边框 接下来我们主要讲解增强型的选择器，主要分两种，属性选择器和伪类选择器 1、属性选择器 1.1完全匹配选择器 语法：[attribute=value] 属性匹配选择器[id=article]{ color:red;} 1.2包含匹配选择器 语法：[attribute*=value] 属性匹配选择器属性匹配选择器属性匹配选择器[id*=arti...
整理些选择器，加深印象和理解标签选择器 body{} 表示body标签类选择器 .className{} 表示类名class为className的所有标签id选择器 #idName{} 表示id为idName的所有标签属性选择器 P[id="yt"]{} 表示所有P标签，且P标签的id属性为yt开头的所有标签属性选择器 P[id^="yt"]{} 表示所有P标签，且P标签的id属性以yt开头的所有标签属性选择器 P[id$="yt"]{} 表示所有P标签，且P标签的id属性以yt结尾的所有标签属性选择器 P[id*="yt"]{}...
1、实例源码 CSS3的[att$=val]选择器 [id$=div_border]{ background-color:#9F6; width:160px; font-family:微软雅黑; font-size:18px; font-size-adjust:!important; font-stretch:expanded; font-style:oblique; font-variant:inherit; font-weight:bolder; alignment-adjust:after-edge; alignment-baseline:alphabetic; marquee-speed:normal; } [id$=child]{ background-col...
1、实例源码 CSS3的[att=val]选择器 [id=div_border]{ background-color:#C00; width:110px; font-family:微软雅黑; font-size:18px; font-size-adjust:!important; font-stretch:expanded; font-style:oblique; font-variant:inherit; font-weight:bolder; } 星期一 星期二 星期三 星期四 星期五 星期六 星期日 ...
1、实例源码 CSS3的[att*=val]选择器 [id*=div_border]{ background-color:#9F6; width:110px; font-family:微软雅黑; font-size:18px; font-size-adjust:!important; font-stretch:expanded; font-style:oblique; font-variant:inherit; font-weight:bolder; } [id*=child]{ background-color:#C00; } 星期一 星期二 星期三 星期四 ...
1、实例源码 CSS3的[att^=val]选择器 [id^=div_border]{ background-color:#9F6; width:160px; font-family:微软雅黑; font-size:18px; font-size-adjust:!important; font-stretch:expanded; font-style:oblique; font-variant:inherit; font-weight:bolder; alignment-adjust:after-edge; alignment-baseline:alphabetic; marquee-speed:normal; } [id^=child]{ background-col...
一：基本介绍 1：css版本 css1: 定义了网页的基本属性：字体，颜色，补白，基本选择器等等。 css2：添加了高级功能：浮动，定位，高级选择器（子选择器，相邻选择器，通用选择器） css3：遵循模块化开发。发布时间并不是一个时间点，而是时间段。（2002-至今） 2：css3新特性 （1）CSS选择器 （2）新的颜色制式和透明设定 （3）多栏布局的实现 （4）多背景图效果 （5）文字阴影效果 （6）开放的网络字体类...
last-of-type选择器 “:last-of-type”选择器和“:first-of-type”选择器功能是一样的，不同的是他选择是父元素下的某个类型的最后一个子元素。 示例演示 通过“:last-of-type”选择器，将容器“div.wrapper”中最后一个段落元素背景设置为橙色 （提示：这个段落不是“div.wrapper”容器的最后一个子元素）。 HTML代码： 我是第一个段落 我是第二个段落 我是第三个段落 我是第一个Div元...
CSS3模块化结构 CSS历史发展 CSS（Cascading Style Sheet），层叠样式表，是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。 CSS3属性选择器 E[attr=val]表示具有属性att且其值等于val E[attr*=val]表示具有属性attr且其值中包含val E[attr^=val]表示具有属性attr且其值以val开头 E[attr$=val]表示具有属性attr且其值以val结尾 事实上除了以上四个之外还有俩用的相对比较...
css3 选择器 根据所获取页面中元素的不同，把css3选择器分为五大类： 基本选择器 层次选择器 伪类选择器 动态伪类选择器 目标伪类选择器 语言伪类选择器 UI元素状态伪类选择器 结构伪类选择器 否定伪类选择器 伪元素 属性选择器 基本选择器 基本选择器是CSS中使用最频繁，最基础，也是CSS中最早定义的选择器。通过基本选择器可以确定HTML树形结构中大...
CSS3新增了嗯- -21个选择器,脚本通过控制台在这里运行; ~: p ~ p { color : red;/*此条规则将用于p后边所有的p...就是除了第一个p的所有p,规则同p:not(:nth-of-type(1)),但是权重要低于后者*/} [attribute^=value]: 选择该属性以特定值开头的元素 [attribute$=value]: 选择该属性以特定值结尾的元素 [attribute*=value]: 选择该属性中出现了特定值的元素 上边三个是可以组合使用的,方法如 ↓...
话说园子里也混迹多年了，但是基本没写过blog，写点基础的，那就从css3选择器开始吧。 Css3选择器 先说下，为什么提倡使用选择器。 使用选择器可以将样式与元素直接绑定起来，在样式表中什么样式与什么元素匹配一目了然，修改起来也很方便。 减少样式表的代码量。 属性选择器 1.[att*=val]属性选择器 意义：表示元素用att表示的属性的属性值包含用val表示的字符，则该元素使用这个样式 ...
之前看到有些网站选中内容的颜色和背景色都不是平时看到的蓝色和白色。今天有兴趣查看了一下，原来是一个很简单的CSS3的选择器::selection的用法。 上例子： .selectColor::selection{color:#fff;background:pink;} .selectColor::-moz-selection{color:#fff;background:pink;} .selectColor::-webkit-selection{color:#fff;background:pink;} 普通文本，不设置::section,选中时文本的颜色为白色...
直接开始正文。 一、属性选择器 属性选择器就是根据元素的属性及属性值来选择元素，用好属性选择器可以让你的级别上升一个层次。 1、只根据属性选择元素 适用于希望选择有某个属性的元素，只关心属性不关心属性值。。 Note：元素和方括号中间没有冒号，也不能有空格，方括号之间也不能有空格。 a、根据一个属性选择【E[Attr]】： *[title]{color:blue;}就可以给所以带title的元素设置样式。 a[href]{color:red;}只对...
接css3选择器（一） 八、结构性伪类选择器【:nth-child(n)】 :nth-child(n)选择器用来匹配某个父元素的一个或多个特定的子元素，和jquery中一样。 其中"n"是其参数，而且可以是整数值(1,2,3,4)，也可以是表达式（2n+1,-n+5）和关键字(odd【奇数】、even【偶数】)，但是参数n的值起始值始终是1，而不是0。也就是说，参数n的值为0时，选择器将选择不到任何匹配的元素。 Note:当“:nth-child(n)”选择器中的n为一个表达式时，其...