css
关注
分享
扫一扫
文章平均质量分 63
H_Cisco
路在脚下，只要走起来离目标会近一点。
展开
-
css权重
！important>行间样式>id>class或属性或伪类>标签选择器>通配符 infinity 1000 100 10 1 0 256进制父子选择器/派生选择器 <!DOCTYPE html><html> <head> ...原创 2018-11-10 21:28:59 · 5013 阅读 · 0 评论 -
CSS3——给div设置背景图片
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; padding: 0; } div{ width: 200px; height: 2原创 2018-11-19 17:43:53 · 29991 阅读 · 0 评论 -
CSS3——浮动模型
咱们一共有三大模型，盒模型，层模型，浮动模型。浮动模型最恶心，就一条float:left/right;，你别看这一条，他能引发很多问题。<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{原创 2018-11-18 09:53:36 · 7267 阅读 · 0 评论 -
CSS3——伪元素
伪元素天生存在于任意元素里面，任意元素里面有两个特殊的伪元素，一个叫before一个叫after。<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; paddi原创 2018-11-18 10:17:12 · 7572 阅读 · 0 评论 -
CSS3——解决父级元素包裹子级元素的方法（伪元素+其他）
利用伪元素清除浮动：你要解决浮动的为题必须在父级的逻辑的后面加上一个p元素来清除浮动吧，你加完p元素之后破坏结构了，不好，咱相加，又不能加，就用伪元素最合适了吧！<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"&原创 2018-11-18 10:49:23 · 12381 阅读 · 2 评论 -
CSS3——元素嵌套规则
元素嵌套规则：行级元素只能嵌套行级元素，块级元素可以嵌套任何元素。Div里面可以加任何东西，但是span就只能加行级元素，行级元素嵌套行级元素很正常，行级元素本来空间就小，不可能嵌套块级元素，但是有个特殊的，p标签是块级元素，p标签里面套个div是不是无可厚非，就不行，这就是规定，P标签里面就是不能嵌套块级元素，咱写一写试试。<!DOCTYPE html><...原创 2018-11-24 12:45:25 · 8123 阅读 · 0 评论 -
CSS3——淘宝留白
做一个淘宝的留白：当你在缩小浏览器页面的时候他的内容区并没有缩小，是留白的变小。<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css&quo原创 2018-11-24 15:46:49 · 7217 阅读 · 0 评论 -
CSS3——去掉图片之间的空格
元素一共就有三种：inline，inline-bolck，block，其中inline，inline-bolck都带有inline，凡是带有inline的元素都是文本类元素。文本有什么特点呢？比如现在有一堆文字，中间用很多个空格隔开，在浏览器中你会发现文字之间只有一个空格，因为空格表示的是文字分隔符，所以中间会有一个小的空隙。文本类元素也符合这个概念，比如<span>123&l...原创 2018-11-24 15:48:10 · 8955 阅读 · 0 评论 -
CSS3——span问题
Span问题：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ margin: 0; p原创 2018-11-24 15:49:17 · 7317 阅读 · 0 评论 -
CSS3——对其规则
对其规则：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ margin: 0; pad原创 2018-11-24 15:51:19 · 6873 阅读 · 0 评论 -
CSS3——手机端百度贴吧
做一个 ：前面有一个小logo，后=后面有一个小三角。<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *原创 2018-11-24 16:41:57 · 6913 阅读 · 2 评论 -
纯CSS写一个环绕动画效果
<!DOCTYPE html><html lang="en"> <head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,...原创 2019-01-01 00:00:01 · 9934 阅读 · 0 评论 -
测试颜色（#000-#fff）
<html><head> <SCRIPT language=javascript> function makeArray(q) { for (i = 1; i <= q; i++) { this[i] = 0 ...原创 2019-01-09 18:10:41 · 14207 阅读 · 0 评论 -
CSS3——溢出容器，打点展示
溢出容器，打点展示：1.但行文本2.多行文本 单行文本：三件套 white-space: nowrap;/* 强制不换行 */ overflow: hidden;/* 超过的部分隐藏 */ text-overflow: ellipsis;/* 打点展示 */<!DOCTYPE html><...原创 2018-11-19 17:43:01 · 7685 阅读 · 0 评论 -
CSS3——margin合并，塌陷与合并的总结
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; padding: 0; } .demo1{ background-color: red;原创 2018-11-17 10:37:21 · 7811 阅读 · 0 评论 -
CSS初始化标签
自定义标签-标签选择器比如你在百度搜索的时候，你搜索的关键词会变红，他就是用em写的。 所以用这样的方式咱们可以初始化很多标签。 还比如ul和li出生的时候有大圆点，咱么可以通过ul{list-style:none;}把它去掉，他天生还带与padding和margin，你如果把他的padding和margin值都设成0，他的间距和空格就会全部没有了。这就叫做初始...原创 2018-11-13 21:19:10 · 9134 阅读 · 0 评论 -
远视图
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> .demo6{ height: 10px; width: 10px; background-color: #fff; }原创 2018-11-15 13:18:11 · 10514 阅读 · 0 评论 -
CSS3的网页定位技术（1）——绝对定位
一：position: absolute;——绝对定位div{ height: 100px; width: 100px; background-color: red; position: absolute; } ...原创 2018-11-15 13:21:02 · 9654 阅读 · 2 评论 -
CSS3网页定位技术（2）——相对定位
二：position: relative;——相对定位<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; padding: 0; } .demo{原创 2018-11-15 13:27:16 · 8727 阅读 · 0 评论 -
CSS3网页定位技术（3）——fixed浮动定位
三：Position还有第三个值：fixedFixed和absolute差不多，有一点小的不同。你会发现一些广告的页面，无论你怎样滚动滑轮，广告是不东的。 <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"&a原创 2018-11-15 13:29:34 · 9519 阅读 · 0 评论 -
CSS3——五元环
练习2：写出一个五元环，让这个五环在屏幕的正中间，永远居中。提示：.demo1{ height: 100px; width: 100px; border: 10px solid black; border-radius:/* 50%;设置四个角都是50%的圆角,他就会形成一个园 */ z-index: 1;/* 默认为0,值越大,他就越...原创 2018-11-15 14:01:54 · 8738 阅读 · 0 评论 -
css小技巧-元素分类、字体的样式、画三角形、光标样式
行级元素（span，strong，em，a，del）-内联元素Feature：内容决定元素所占位置 不可以通过css改变宽高display:inline;2.块级元素（div,p,ul,li,ol,form,address）-块元素Feature：独占一行 可以通过css改变宽高display:block;3.行级块元素 Featu...原创 2018-11-12 11:20:00 · 8613 阅读 · 0 评论 -
css-淘宝网站——实现几张图片横排中间没有空隙
淘宝网站——实现几张图片横排中间没有空隙凡是带有inline的元素都有文字特性，有文字属性就该被分割。 1.<img src="1.jpg"> <img src="1.jpg"> <img src="1.jpg"> <img src="1.jpg">把img之间的原创 2018-11-12 11:21:52 · 9489 阅读 · 4 评论 -
css-企业团队开发技巧
在实际开发中，我们大多采用先定义功能再选配功能，而不是先写内容再写功能。<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> .demo1{ height: 100px; width: 10原创 2018-11-12 11:23:38 · 8537 阅读 · 0 评论 -
CSS3——两栏布局
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; width: 0; } .demo1{ height: 100px; width:原创 2018-11-16 16:11:58 · 8659 阅读 · 0 评论 -
CSS3——垂直定位的小bug（margin塌陷）
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; width: 0; } .demo1{ /* margin-left: 100px;原创 2018-11-16 16:19:04 · 8634 阅读 · 0 评论 -
CSS3——在网速不好的情况下，如何让一个网站还可以用
第一种方法：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <style type="text/css"> *{ margin: 0; padding: 0; } a{ display: inline-block原创 2018-11-23 17:24:26 · 6989 阅读 · 0 评论 -
DOM初探（19）——读写元素CSS属性
视频：https://ke.qq.com/course/231577?taid=3983676656552089脚本化CSS（一）：读写元素CSS属性 dom.style.prop可读写行间样式，没有兼容性问题，碰到float这样的保留字属性，前面应该加CSSeg:float -àcssFloat(用原来得div.style.float也没毛病)符合属性必须拆解...原创 2019-03-03 12:49:36 · 8301 阅读 · 0 评论