随笔分类 -  CSS

1 2 3 下一页
CSS——BFC
摘要：http://www.cnblogs.com/lhb25/p/inside-block-formatting-ontext.html 元素若不是bfc，那么内部浮动元素的高度不参与计算 元素若不是bfc。那么与浮动元素会重叠，若是bfc，不会与浮动元素重叠 元素若不是bfc，内部元素的margin- 阅读全文
posted @ 2018-06-15 11:10 var_obj
CSS——改变浏览器滚动条样式
摘要：https://www.cnblogs.com/sun-rain/p/5789417.html 阅读全文
posted @ 2018-06-10 09:39 var_obj
用省略号替代文字超出部分
摘要：css就能够处理这样的需求 单行文本超出 多行文本超出 参考地址：地址 阅读全文
posted @ 2018-05-20 22:58 var_obj
css样式初始化
摘要：/* CSS Document */ body {margin:0; padding:0; font:12px "\5B8B\4F53",san-serif;background:#fff;} div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0; margi... 阅读全文
posted @ 2018-04-18 08:46 var_obj
JS高级——封装注册事件
摘要：兼容性问题 1、ele.on事件类型 = function(){}一个元素ele注册一种事件多次，会被替换成最后一个，所以有局限性 2、addEventListener(事件类型,事件处理函数,useCapture) 第三个参数默认是false，冒泡阶段执行 3、attachEvent(事件类型，事 阅读全文
posted @ 2018-01-27 14:45 var_obj
CSS——img标签消除3px
摘要：1、dispaly：block 2、float：left 这两种都可以消除3px 阅读全文
posted @ 2018-01-06 15:38 var_obj
CSS——轮播图中的箭头
摘要：注意事项： 1、定位中left权重比right高，top权重比bottom高 2、两个span标签嵌套在一个盒子中，将来显示隐藏只需要控制父盒子就行了 阅读全文
posted @ 2017-11-29 13:36 var_obj
CSS——tab导航demo
摘要：问题总结： 1、ul要比外套div宽度的值大一点 2、ul需要往左移动1px 3、外套的div设置overflow隐藏 解决抖动： 1、li宽度设置98px，padding左右值1px，hover之后宽度不变，padding清零 2、li宽度设置100px，hover之后宽度设为98px bug问题 阅读全文
posted @ 2017-11-15 14:14 var_obj
CSS——层级
摘要：层级问题：选中的盒子显示的效果并不完整，右边的边框并没有显示红色，原因是其右边的盒子压了它的边框。 层级大小：标准流盒子，低于浮动的盒子，浮动的盒子又低于定位的盒子（高低和占不占位置无关）。 解决办法：1、必须有定位。（除去static之外）。 2、给定z-index的值为层级的值。（不给默认为0） 阅读全文
posted @ 2017-11-14 11:15 var_obj
CSS——半透明
摘要：1、opacity：不仅背景半透明，内部其他元素也半透明 2、rgba()：只有背景半透明。 阅读全文
posted @ 2017-11-13 15:23 var_obj
CSS——dispaly、overflow、visibility、opacity
摘要：隐藏盒子： 1.overflow：hidden; 隐藏盒子超出的部分。 2.display: none; 隐藏盒子，而且不占位置。(用的最多) 3.visibility: hidden; 隐藏盒子，而且占位置。 4.opacity: 0; 隐藏盒子，而且占位置。(用的多) 5.Position/to 阅读全文
posted @ 2017-11-13 14:23 var_obj
CSS——◇demo
摘要：核心思想：嵌套盒子中的◇超过父盒子的部分隐藏。 第一种写法： 第二种写法： 效果： 注释：s标签必须转成块级元素，display的值必须是block。 阅读全文
posted @ 2017-11-10 13:22 var_obj
CSS——font
摘要：行高的量取方式： 1、第一行可设置margin-top值。然后将第一文字顶部到第二行文字顶部的值作为行高的值（要注意对齐方式） 2、将 3、电视上 阅读全文
posted @ 2017-11-08 17:24 var_obj
CSS——ul（demo）
摘要：1、ul本身是块级元素，在实际运用中，我们不设定宽高的话，它的宽就是父元素的宽，它的高就是内容撑起来的高度。 2、在局部布局的时候，我们可以不用设定ul的宽度和高度，直接使用margin来巧妙布局。 3、上述如果设定了ul或者其他盒子的宽度以后，会出现一个问题就是margin-left的值过大，盒子 阅读全文
posted @ 2017-11-08 14:31 var_obj
CSS——滑动门
摘要：在背景图片中可以对图片进行圆角设置，但是这样是写死的。如下图： 情况分析：如果我们li标签中的文字变少了或者变多了，我们就需要重新定义背景图片。所以我们使用滑动门技术。它将图片特殊地方进行分割。宽度利用的是字体的宽度，在加上padding进行调整。 效果： 阅读全文
posted @ 2017-11-08 12:42 var_obj
CSS——属性选择器
摘要：属性选择器：通过对标签中属性的选择，控制标签。 效果： 参考：CSS3 [attribute*=value] 选择器 阅读全文
posted @ 2017-11-08 09:52 var_obj
CSS——精灵图与背景图片定位
摘要：精灵图产生背景： 1、网页上的每张图像都需要向服务器发送一次请求才能展现给用户。2、网页上的图像过多时，服务器就会频繁地接受和发送请求，大大降低页面的加载速度。为了有效地减少服务器接受和发送请求的次数，提高页面的加载速度，出现了CSS精灵技术（CSS Sprites） 精灵图的定义： 1、很多图片融 阅读全文
posted @ 2017-11-08 09:46 var_obj
CSS——text-indent
摘要：在h1标签里套入a标签并写上文字，有利于seo，但是文字如何隐藏呢？一般都是a标签变成内联块并首行缩进为负值。 效果： 阅读全文
posted @ 2017-11-07 17:48 var_obj
CSS——样式隐藏
摘要：overflow:hidden: 溢出隐藏 visibility:hidden: 隐藏元素 隐藏之后还占据原来的位置。 display:none: 隐藏元素 隐藏之后不占据原来的位置。 Display:block: 元素可见 Display:none 和display:block 常配合js使用。 阅读全文
posted @ 2017-11-07 17:30 var_obj
CSS——规避脱标流和vertical-align
摘要：规避脱标流： 1、尽量使用标准流。 2、标准流解决不了的使用浮动。 3、浮动解决不了的使用定位。 问题解决：嵌套盒子在不使用定位的情况下定位到右上角 注释：margin-left:auto的意思是盒子往右边冲，冲不动了就停下了。 图片和文字垂直居中： vertical-align对inline-bl 阅读全文
posted @ 2017-11-07 17:19 var_obj

1 2 3 下一页