CSS知识点

CSS模糊筛选器

1
2
3
4
5
6
7
8
9
<!--p是标签的类型,class是标签的属性,important是需要模糊查询的内容-->
p[class~='important'] {color: red;}

div[id^='filePicker']{
width: 200px;
}

img[title~='Figure'] {border: 1px solid gray;}

JQuery 给样式添加important的样式

1
$(".tab_close").css("cssText","display:none !important");
类型 描述
[abc^=”def”] 选择 abc 属性值以 “def” 开头的所有元素
[abc$=”def”] 选择 abc 属性值以 “def” 结尾的所有元素
[abc*=”def”] 选择 abc 属性值中包含子串 “def” 的所有元素

CSS3实现一直旋转的图片

使用方法:①新建一个DIV,class=”demo_div”,div里面放一个图片,就能让图片一直进行旋转了,很好玩

1
2
3
4
5
6
7
8
9
10
11
12
@-webkit-keyframes rotation{
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(360deg);}
}

.demo_div{
-webkit-transform: rotate(360deg);
animation: rotation 3s linear infinite;
-moz-animation: rotation 3s linear infinite;
-webkit-animation: rotation 3s linear infinite;
-o-animation: rotation 3s linear infinite;
}