随笔分类 -  精通css

display: block; 和 display: inline; 的区别
摘要：dispaly: block 形成一个块框，元素特点： 1. 处于常规流中时，如果width没有设置，会自动填充满父容器 2. 可以应用margin/padding 3. 在没有设置高度的情况下会扩展高度以包含常规流中的子元素 4. 处于常规流中时布局时在前后元素位置之间（独占一个水平空间） 5. 阅读全文
posted @ 2017-08-04 17:52 少东主 阅读(541) 评论(0) 推荐(0)
CSS实现垂直居中
摘要：[TOC] 我们经常用 来实现水平居中，而一直认为 不能实现垂直居中…… 实际上，实现垂直居中仅需要声明元素的高宽和下面的CSS: 这种方式被称为绝对居中(Absolute Centering)。 绝对居中(Absolute Centering) 优点： 支持跨浏览器，包括IE8 IE10. 无需其 阅读全文
posted @ 2017-08-04 16:33 少东主 阅读(242) 评论(0) 推荐(0)
CSS中实现水平居中
摘要：[TOCM] 如果需要居中的元素分别为一下几类: 1.常规流中 inline 元素， 为父元素设置 text align: center; 即可实现。 2.常规流中 block 元素， 1）为元素设置宽度， 2）设置左右 margin 为 auto。 3）IE6 下需在父元素上设置 text ali 阅读全文
posted @ 2017-08-04 16:32 少东主 阅读(212) 评论(0) 推荐(0)
CSS Hacks
摘要：[TOC] 注：下面的内容没有全部进行实验，因此可能有些有误，以后在开发中遇到再进行修正。 0. 基本概念 因为各个浏览器厂商与版本的差异，尤其是万恶的 IE 存在各种的不标准，因此，在进行页面开发时不免要为 IE 单独写一些 CSS 。本文是针对各大浏览器（主要是 IE）单独写CSS样式的几种方法 阅读全文
posted @ 2017-05-08 19:04 少东主 阅读(572) 评论(0) 推荐(0)
【精通CSS】定位
摘要：[TOC] 盒模型 3 种定位机制 CSS 中有 3 种基本的定位机制：普通流、浮动、绝对定位。除非专门制定了，否则所有的框都在普通流中定位——普通流中元素框的位置由元素在 HTML 中的位置来决定。 块框： p、h1、div 等元素是块元素，意味着显示为一块内容，即块框。 行内框： strong、 阅读全文
posted @ 2017-05-08 19:03 少东主 阅读(153) 评论(0) 推荐(0)
【精通CSS】基本知识
摘要：[TOC] DTD & DOCTYPE DTD （文档类型定义）是一组机器可读的规则，它们定义 XML 或 HTML 的特定版本中允许有什么，不允许有什么。在解析网页时，浏览器使用这些规则来检查页面的有效性，并且采取相应的措施。浏览器是通过分析页面的 DOCTYPE 声明来了解要使用哪个 DTD， 阅读全文
posted @ 2017-05-08 19:03 少东主 阅读(194) 评论(0) 推荐(0)