06 2017 档案

摘要：http://www.zhangxinxu.com/study/201008/css3-color-names.php 阅读全文

摘要：flex是一个复合属性，所以有三个值设置，这也就造成了flex可以只设置一个值或两个值： 如果flex只设置一个值： 没有单位的数，则这个值是flex-grow， 并且flex-basis变为0 有单位的数，比如px或em，则这个值是flex-basis 关键字，auto或者none或者conten 阅读全文

摘要：前两天写了一篇关于display：table的用法，里面涉及到居中的问题，这两天愈发觉得css中的居中是一个值得关注的问题，现总结如下。 一、垂直居中 （1）inline或者inline-*元素 1. 单行文字 设置上下padding相等 以前一直以为inline元素是没有上下的padding和ma 阅读全文

摘要：DIV+CSS的布局已经让表格布局几乎很少用到，除非表格语义性很强的情况。 display：table解决了一部分需要使用表格特性但又不需要表格语义的情况， 尤其是DIV+CSS很不方便解决的问题，比如以下两种情况： 一、父元素宽度固定，想让若干个子元素平分宽度 通常的做法是手动设置子元素的宽度，如 阅读全文

摘要：“清除浮动”这个说法容易让人产生误解，我认为这个说法的本意应该是“清除浮动带来的负面效果”，这个负面效果即“子元素的浮动会脱离标准文档流，从而造成父元素的高度塌陷”。 解决这个问题有如下几个目前流行的做法。 一、浮动的子元素后加一个空的div，并加上clear：both属性； 二、BFC方法 （1） 阅读全文

摘要：先来看看最终的效果： 这里主要关注如何将“用户名”“请设置密码”以及他们紧跟的input元素设置为图中的对齐样式。 先来看看html代码： 注意为什么要使用label来包裹“用户名”“请设置密码”，马上就会用到，css代码如下： 注意这里对label使用了inline-block属性值，也就是说可以 阅读全文

摘要：一、横向菜单 inline-block是不换行的块级元素，对于使用ul-li结构的网页顶部横向导航菜单非常有用。 如果不使用inline-block属性，只能使用float来浮动每个li元素，写起来比较麻烦，如果使用了inline-block代码相对简单： css代码如下： 二、需要行内排列设置大小 阅读全文