本篇教程介绍了HTML+CSS入门 Selenium - Css Selector使用方法，希望阅读本篇文章以后大家有所收获，帮助大家HTML+CSS入门。

<

什么是Css Selector？

Css Selector定位实际就是HTML的Css选择器的标签定位

工具

Css Selector可以下载火狐浏览器插件，FireFinder 或 FireBug和FirePath组合使用。

 

使用方法：

1. Css Selector支持ID、Class的定位 与HTML中CSS定位相同

定位ID：id = "navi"  ->

 #navi

定位Class: class = "inner" ->

.inner

多个Class定位： class = " c1 c2 c3" -> 

.c1.c2.c3

2. Css Selector支持任意属性定位

[name="name"]

3. Css Selector提供了标签属性组合定位

input[name="name"]

当与ID、Class 组合使用时书写方式更为简单 

Class ->
input.c1
ID    ->
input#i1

4. Css Selector提供了多属性组合过滤

select[size=‘4‘][multiple=‘multiple‘]

5. Css Selector支持层级关系定位

div.inner>input
select>option[value=‘3‘]

 

6. Css Selector模糊匹配

以xx开始

[placeholder^=‘请通过ID‘] 

以xx结束
[placeholder$=‘ID定位元素‘] 

包含xx
[placeholder*=‘ID‘] 

 

优点：CSS选择器语法比较简洁，运行速度比较快。

缺点：不支持index定位

总结： 写UI自动化时优先用Css Selector 选择器，不能用在用Xpath 选择器。    

本文由职坐标整理发布，欢迎关注职坐标WEB前端HTML/CSS频道，获取更多HTML/CSS知识！