CSS常见选择器
一、元素选择器
p,html,h1, h2
1、多个元素一起设置同一种风格, 则用逗号“,”隔开(选择器分组)
2、通配符选择, *{Color:red} 表示文档中所有元素都为红色
二、类选择器
对元素class属性值 class="classValue" 进行选择
1、 *.classValue1 表示选择 class值为 classValue1的所有元素;
2、 p.classValue2 表示class值为 classValue1的P元素(元素选择跟类选择搭配使用)
三、ID选择器
在一个 HTML 文档中,id属性值是唯一的, 使用id选择,格式如下 <p id="idValue">……
#idValue
四、属性选择器
1、a[href] 表示选择有包含 href属性的a元素 (属性选择习惯跟元素选择结合使用)
2、a[href][title] 表示选择同时含有 href属性 和 title属性的a元素
3、具体到属性值选择
1)属性值完全匹配 a[href="www.baidu.com"][title="jennifer"]
2)属性值部分匹配 a[href~="baidu.com"]
| [attribute] | 用于选取带有指定属性的元素。 |
| [attribute=value] | 用于选取带有指定属性和值的元素。 |
| [attribute~=value] | 用于选取属性值中包含指定词汇的元素。 |
| [attribute|=value] | 用于选取带有以指定值开头的属性值的元素,该值必须是整个单词。 |
| [attribute^=value] | 匹配属性值以指定值开头的每个元素。 |
| [attribute$=value] | 匹配属性值以指定值结尾的每个元素。 |
| [attribute*=value] | 匹配属性值中包含指定值的每个元素。 |
五、后代选择器
h1 em 表示 作为h1元素后代的任何em元素,注意,以空格隔开
<h1> <li><em>xxx </em> </li> <em>xxx </em> </h1> 后代选择器,两个元素之间的层次间隔可以是无限的,不论 em 的嵌套层次多深,都被选择
例如,要找到蓝色底纹位置,css语句可以为 css=ul[id^=personalizationDetail] ul>li:nth(1) (nth序号从0算起)
选择id包含personalizationDetail的ul元素 的后代 ul(隔了两代),接着找ul的第2个li子元素

六、子元素选择器
使用大于号 > (子结合符),例如:验证价格price,则:
assertText css=ul.typeReview>li:nth(3) Fee:$5.00

七、相邻兄弟选择器
使用 + 号(相邻兄弟结合符)隔开两个元素,
例1:table + ul 表示选择紧接在 table 元素后出现的所有兄弟 ul 元素
例2:用一个结合符只能选择两个相邻兄弟中的第二个元素,例如:li + li {font-weight:bold;},只对蓝色底纹部分起作用

注:
selenium1.0元素选择器有:
1.id=id:
2.name=name:
3.link=textPattern
4.dom=javascriptExpression:
5.xpath=xpathExpression: 见《xpath选择器》
6.css=cssSelectorSyntax
selenium2.0选择方法:
- By.id()
- By.className()
- By.tagName()
- By.name()
- By.linkText()
- By.partialLinkText()
- By.xpath("xpath表达式")
- By.cssSelector("css选择器")
本篇小结css,其他选择器小结待续……
CSS常见选择器的更多相关文章
- CSS 常见的8种选择器 和 文本溢出问题
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>c ...
- CSS常见的选择器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS.01 -- 选择器及相关的属性文本、文字、字体、颜色、
与html相比,Css支持更丰富的文档外观,Css可以为任何元素的文本和背景设置颜色:允许在任何元素外围设置边框:允许改变文本的大小,装饰(如下划线),间隔,甚至可以确定是否显示文本. 什么是CSS? ...
- css以及选择器基础
CSS样式基础了解1.css基础语法CSS样式的出现是为了将内容和表现分离极大的提高了工作效率内联样式(在 HTML 元素内部)<p style="margin-left: 10px: ...
- css节点选择器
基础选择器 基础选择器是选择器的所有选择器的基本组成元素,也最简单,包含如下5个类别: ID选择器 标签选择器 类选择器 属性选择器:类选择器算是一个特殊的属性选择器,通用的属性选择器举例如下: #c ...
- CSS常用选择器的认识
---恢复内容开始--- 前言:在CSS中选择器的种类有很多很多,但是在实际的工作中,我们经常会用到的分为两大类:基础选择器和复合选择器这两个大类,学习选择器的目的就是为了在复杂的页面中能够快速定位到 ...
- css CSS常见布局解决方案
CSS常见布局解决方案说起css布局,那么一定得聊聊盒模型,清除浮动,position,display什么的,但本篇本不是讲这些基础知识的,而是给出各种布局的解决方案.水平居中布局首先我们来看看水平居 ...
- CSS 之 选择器
CSS的常见选择器 一.简单选择器 Simple Selectors 选择器 含义 * 通用元素选择器,匹配任何元素 E 标签选择器,匹配所有使用E标签的元素 .info class选择器,匹配所有c ...
- 突破css选择器的局限,实现一个css地址选择器?
首先看一个效果,注意地址栏的变化 然后思考一下,用css如何实现? css选择器的局限 选择器是css中的一大特色,用于选择需要添加样式的元素. 选择器的种类有很多,比如 元素选择器 p {color ...
随机推荐
- 五指CMS发布1.4版本,更多的新功能
五指cms v1.4变更: 新增内容手动分页新增百度地图新增订单管理模块新增订单地址管理增加Microsoft YaHei字体新增推广邀请模块新增私密下载,下载函数 新增百度地图新增筛选功能 修正全局 ...
- 简单三步为Azure安装 Visual Studio
如果你尚未安装 Azure Tools,此过程可帮助你安装.如果你已安装 Azure Tools,则可以转到下一个过程. 安装 Azure Tools 若要安装 Azure Tools,请在菜单栏上依 ...
- 新花生壳内网版2.3 + Tomcat7 搭建自己的网站(2015.01.21)
网上很多资料,问题主要是出在 tomcat 的访问上而已: 如下总结一下: 首先在 花生壳 官网(http://hsk.oray.com/)注册一个帐号,每个帐号可以领取一个免费域名 然后下载安装新版 ...
- ural 1748 The Most Complex Number 和 丑数
题目:http://acm.timus.ru/problem.aspx?space=1&num=1748 题意:求n范围内约数个数最多的那个数. Roughly speaking, for a ...
- 问题-delphi XE2 Stack Overflow- save your work and restart CodeGear
问题现象:某一天,启动DLEPHI XE2 后,新建一个工程,双击一个事件,“Stack Overflow- save your work and restart CodeGear delphi xe ...
- A Tour of Go Slicing slices
---恢复内容开始--- Slices can be re-sliced, creating a new slice value that points to the same array. The ...
- 从app里跳到appstore评论页面的实现
// 如果要实现在应用里面跳到appstore的对应评论页面里面的话,只要将下面地址中App_ID替换成自己的id就可以了,其他的地方都不用管. // 如果要用Safari浏览器做实验的话可以将地址中 ...
- freemaker分页模板
<link href="${base}/res/pra/css/style.css" rel="stylesheet" type="text/c ...
- git 删除分支和删除文件夹
1.删除分支 1.1查看所有分支: git branch -a 得到结果: 1.2删除HEAD分支 git push origin --delete HEAD 2.删除文件夹 2.1 查看本地分支下的 ...
- ActiveMQ, Qpid, HornetQ and RabbitMQ in Comparison
国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...