css
Joris要为所欲为
Web前端
展开
-
css linear-gradient 实现条纹样式
参考:《CSS SECRETS》Chapiter 2-5作者:Lea Verou测试所用浏览器:Chromehtml :<!DOCTYPE html><html><head> <meta charset=&a原创 2018-12-26 18:11:49 · 601 阅读 · 0 评论 -
css repeating-linear-gradient实现条纹进度条效果
html :<!DOCTYPE html><html><head> <title>模拟进度条条纹样式</title> <link rel="stylesheet" href="style_stripe.css"></head><body原创 2018-12-26 23:10:05 · 2243 阅读 · 0 评论 -
@media媒体查询的使用方法及注意事项
.customContainer{ height: 40px; margin: 0 auto; background-color: purple;}@media screen and (max-width: 768px){ .customContainer{ width: 100%; }}@media screen and (min-width: 768px) and (...原创 2019-01-23 22:51:36 · 824 阅读 · 0 评论 -
兄弟选择器的用法( + , ~ )
+选择器说明:1.选中某元素后面紧跟的兄弟元素(不包括该元素本身)2.当使用 a + a即+前后元素名称相同时,将会循环调用+选择器,直到找不到为止。<ul> <li>1</li> <li>2</li> <h1>3</h1> <li>4</li>原创 2019-01-23 23:41:38 · 1066 阅读 · 0 评论 -
css选择器之模糊匹配
1.[class*=“icon”]{…}说明:所有class包含"icon"字符串的元素都会被选中[class*="icon"]{ color:red; }<div class="icon-test1">111111</div><div class="icon-test2">222222</div>原创 2019-01-24 15:49:18 · 10122 阅读 · 0 评论 -
用div与button标签作为按钮的一些区别
如果button在form表单内部,则可以不用JS绑定onclick属性就可以提交表单内容;而如果不在form表单内部,又不考虑语义化,那么作为按钮,用div和button来写按钮似乎就没什么太多的区别,只存在一些外观上的细微区别。button标签的外观如下:下面分别对button和div进行同样的css修饰:<!DOCTYPE html><html lang="en...原创 2019-01-19 15:55:11 · 11529 阅读 · 3 评论 -
css中继承的权重
继承来的css属性的权重要低于*通配符选择器总体权重排序如下:原创 2019-01-19 16:22:12 · 835 阅读 · 3 评论 -
CSS3案例——用户头像旋转动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="innoRender.原创 2019-01-30 01:08:17 · 470 阅读 · 0 评论