css定位方法

css定位快，語法簡潔

常用屬性css定位：

1、可以通過元素的id、class、標籤這三個常規屬性直接定位到

2、#代表id driver.find_element_by_css_selector('#kw')

3、.代表class driver.find_element_by_css_selector('.s_ipt')

4、直接使用標籤來定位(最好結合其他方法組合定位) driver.find_element_by_css_selector('input')

5、定位name屬性 driver.find_element_by_css_selector("[name='wd']")

6、通過type屬性定位 driver.find_element_by_css_selector('[type="text"]')

7、可以通過標籤與屬性組合來定位

1-通過標籤與class屬性來定位：driver.find_element_by_css_selector('input.s_ipt')

2-通過標籤與id屬性來定位：driver.find_element_by_css_selector('input#kw')

3-通過標籤與其他屬性定位：driver.find_element_by_css_selector('input[name="wd"]')

8、通過層級關係定位:driver.find_element_by_css_selector('form#form>span>input')

9、根據索引定位元素：driver.find_element_by_css_selector('div#switch>a:nth-child(2)')

css邏輯運算：

1、同時匹配多個屬性：

driver.find_element_by_css_selector('input[id="kw"][name="wd"]').send_keys('python')

css高階用法：

後代元素：所有具有相同祖先的元素（包括子元素）

子元素：所有具有相同parent的元素（範圍小於後代元素）
後代選擇器：s2是s1的後代元素
子元素選擇器：大於號s1與s2是父子關係
連續使用：#many>div>p.special 元素之間不存在越級
相鄰兄弟元素選擇器：
+：與是同級關係並且緊靠一起 示例：#food + div
非相鄰兄弟元素選擇器：
使用場景：同一父元素的子元素,元素之間沒有緊靠在一起
~與是同級關係，無需緊靠一起
#food ~ div
屬性選擇器：
*[屬性=」屬性值」] *表示任意元素標籤名，如p, div,li,button,等等
p[spec*='len2'] #屬性spec包含len2的p元素
p[spec^='len2'] #屬性spec以len2開頭的p
p[spec$='len2'] #屬性spec以len2結尾的p
組選擇器：
,與表示兩組不同的css選擇器
示例： div,span,p 同時選擇所有div,span,p元素
偽類nth-child,nth-of-type：
使用場景：根據下標選擇子元素，下標從1開始
:nth-child(n) #從中選擇第n個元素，且表示的元素必須位於父元素的第n位
:nth-of-type(n) #從中選擇第n個元素，對表示的元素處於第幾位沒有要求
表示一組選擇器
例子：

driver.find_element_by_css_selector('

#kw').send_keys('
python')
driver.find_element_by_css_selector(
'.s_ipt
').send_keys('
python')
driver.find_element_by_css_selector(
'input')
#通過name 屬性來定位
driver.find_element_by_css_selector("
[name='wd']
").send_keys('
python')
#通過type屬性定位
driver.find_element_by_css_selector('
[type="text"]
').send_keys('
python')
#通過標籤與class屬性來定位
driver.find_element_by_css_selector('
input.s_ipt
').send_keys('
python')
#通過標籤與id屬性來定位
driver.find_element_by_css_selector('
input#kw
').send_keys('
python')
#通過標籤與其他屬性來定位
driver.find_element_by_css_selector('
input[name="wd"]
').send_keys('
python')
#css通過層級關係定位
driver.find_element_by_css_selector('
form#form>span>input
').send_keys('
python
')

css定位方法

第乙個後代元素 first child 最後乙個子元素 last child nth child n 選取第幾個標籤，n可以是你想要的數字 css 列指示該屬性是在哪個 css 版本中定義的。css1 css2 還是 css3。例子 例子描述 css.class intro 選擇class intr...

CSS 定位方法

position static.是預設的定位方式。position relative.使用這種方式的元素會脫離文件流，相對於它本應該在的位置進行偏移，並且，該元素原來所在的位置會保留下來。當在box2的css裡加入position relative 之後，box2就會脫離文件流，相對於自己以前的位置...

CSS定位使用方法

對於網頁頁面布局來說，使用定位進行布局十分的方便。絕對定位 使用絕對定位應當將父元素設定為相對定位，否則元素絕對定位的基準會一直尋找外層非靜態定位元素 doctype html html lang en head meta charset utf 8 title title title style ...