~=

CSS属性选择器高级用法及选择器优先级问题

一曲冷凌霜 提交于 2019-12-05 01:41:12
CSS选择器之属性选择器 1:[attr] 存在此属性即可 2:[attr = 'attr_value'] 属性值为给定值即可 3:[attr ^= 'attr_value'] attr属性键以container开头 即便是字符串匹配 <style type="text/css"> div[data-type ^= 'container'] { background-color : #000; } </style> <div data-type="container master"> 开头存在 container 匹配成功 </div> <div data-type="containernosensestr"> 开头存在 container 匹配成功 </div> <div data-type="master container"> 不在开头 匹配失败 </div> 4:[attr *= 'attr_value'] attr属性键中存在给定的值即可 即便是字符串匹配 <style type="text/css"> div[data-type *= 'container'] { background-color : #00f; } </style> <div data-type="nosensestrcontainernosensestr"> 只要键值中有给定的值即可匹配成功 <