随笔分类 - css
摘要：要点： div的宽度设为0 border-color 的transparent属性
阅读全文
摘要：平时很多问题，大多是知其然不知其所以然造成的。所以，明白了原理，在遇到问题就有了分析的思路。所以，我希望大家在遇到非标准的问题的时候，也就所谓的某些bug的时候，多去探查一下，为什么会产生这种问题。解决的原理是什么，别解决了就算完了。现在的省事，会给你将来的成长埋下隐患。 而往往所谓的bug，是对规
阅读全文
摘要：box-shadow ： 那第三个参数（模糊距离）和第四个参数（阴影尺寸）你能搞清楚他们的区别吗？ 于是，做下对比： 阴影尺寸： 可见，它相当于增加了border的宽度。但不是border哦，与border不同，box-shadow并不占据空间。在一些渐进增强的地方可以用。 模糊距离： 在这里根据他
阅读全文
摘要：背景： 在用属性选择器的时候，一直是给属性值加引号的，但是经常发现有的地方不给属性值加引号，于是，惑从中来， 那到底是加还是不加？ 那先看几个例子，下面的例子都是从实际的demo中摘出来的，已经确定可以生效的。 [lang|=en] *[lang|="en"] {color: blue;} 结论：
阅读全文
摘要：本文为思路提示篇，因此未详细述说代码，主要总结思路。 1. dispaly：table-cell； vertical-align：middle； 2. 3. 父元素 relative 其本身absolute;方法同上，top：50%； 4. flexbox
阅读全文
摘要：我在div上设置width是200px，但是在审查元素的盒模型里就成了183 内容区确实是按上面计算出来的183px，另外的17px 算在了滚动条上。 虽然写的是183，但实际上这个浅绿色的区域宽度依然是200px； 这里的183 是文字区域的宽度。实际上，文字+滚动条=200px，滚动条也算在内容
阅读全文
摘要：看到这几个词，有点傻傻分不清，故总结一下。 那么什么是伪类呢？之所以说它是“伪”的，不是为了赶时髦，其实可以理解为，它不是真正的一类对象，而是一类对象的某种状态。 比如一类链接<a>的hover状态，就是个“伪”的类。 而伪对象呢，可以理解为本身不是单独的全新的对象，而是将已有的某些对象中划分出来一
阅读全文
摘要：border-spacing 1. 可用，需设置在table标签上或者display为table、inline-table的元素。 必须有border-collapse属性时，才起作用。 如果单元格不分离，怎么来的单元格之间的距离啊。 border-spacing：10px 30px; 表示单元格水
阅读全文
摘要：1. 设置绝对定位后，元素会脱离标准文档流，其原来的位置会被别的元素替代 2. span标签被设置成绝对定位，就可以设置height和width属性，而且不占有原本的空间。 另外，定位absolute的时候，如果top，right，left不设具体值而是默认或者auto的时候，该元素会在其未定位前，
阅读全文
摘要：关于position：absolute 它不是相对于视窗而是相对于最近的“positioned”祖先元素。如果绝对定位（position属性的值为absolute）的元素没有“positioned”祖先元素，那么它是相对于文档的 body 元素，并且它会随着页面滚动而移动。 记住一个“positio
阅读全文
摘要：今天看书的时候，看到这么一段。突然搞不清内容区是什么了。于是，下面这张经典图出现了。同时，还有与之相关的各个边界线。 想到css3里面的，box-sizing属性，默认的就是content-box，及当你设置width时，你设置的是内容区的宽度。 另外还有，border-box，以border的边界
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> img{ float:left; } .box{ border: 1px solid hotpink; } p{
阅读全文
摘要：<p class="important warning"> This paragraph is a very important warning. </p> .important.warning {background:silver;}两个类名之间不含空格，直接连接。选择元素中，必须同时包含这两个类
阅读全文
浙公网安备 33010602011771号