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 ...
随机推荐
- 【转】傅里叶变换 拉普拉斯变 z变换 DFT DCT意义
傅里叶变换在物理学.数论.组合数学.信号处理.概率论.统计学.密码学.声学.光学.海洋学.结构动力学等领域都有着广泛的应用(例如在信号处理中,傅里叶变换的典型用途是将信号分解成幅值分量和频率分量). ...
- Mac OS X Mountain Lion安装Bochs
基本步骤可以看这个帖子 http://hi.baidu.com/any_where/item/990c0acdfbd6542c47d5c003 大体是: 1.安装x11; 2.开启Mac OS X的r ...
- 【原】Redis入门教程
最近在学习Redis,写几篇文章记录一下学习过程:Redis入门教程. 1.Redis基本概念 Redis Redis Keys Redis 基本数据类型 Redis基本操作 遍历操作 Pub-Sub ...
- Fatjar成功安装记录
1.FatJar安装方式 (1)在线安装 具体网址http://kurucz-grafika.de/fatjar (2)离线安装 将fatjar的jar放到plugins文件夹中,重启 2. 安装失败 ...
- mac os develop
. 安装PCRE Download latest PCRE. After download go to download directory from terminal. $ cd ~/Downloa ...
- POJ 1321 棋盘问题 DFS搜索
简单搜索 练习一下回溯 #include <iostream> #include <cstdio> #include <cstring> #include < ...
- Cogs 97. [NOIP2007] 树网的核 Floyd
题目: http://cojs.tk/cogs/problem/problem.php?pid=97 97. [NOIP2007] 树网的核 ★☆ 输入文件:core.in 输出文件:core ...
- [E120L][KitKat][4.4.2][CM11] CM11 rom+ google app安装心得
1. 本文针对 三星手机型号: E120L 即 samsung galaxy S2 HD LTE 2. 本文安装的android ROM 的内核为4.4.2 KitKat 3. 本文安装的第三方RO ...
- 基础 HTML之目录问题(相对路径和绝对路径区别)
一.相对路径和绝对路径 相对路径:以引用文件之网页所在位置为参考基础,而建立出的目录路径.因此,当保存于不同目录的网页引用同一个文件时,所使用的路径将不相同,故称之为相对. 绝对路径:以Web站点根目 ...
- hadoop部署小结的命令
hadoop部署总结的命令 学习笔记,转自:hadoop部署总结的命令http://www.aboutyun.com/thread-5385-1-1.html(出处: about云开发)