css
关注
分享
扫一扫
文章平均质量分 76
李小tt
爱综艺～
展开
-
从图文混排到浮动
从图文混排到浮动在浮动上踩过很多的坑，各种关于浮动的总结也不少，这里也就自己最近的学习谈一谈我对浮动的理解～ 关于浮动最经典的莫过于图文混排了，印象中的图文混排是这样的： 为了完成这个格式，我写下了这样一段代码：<html><head><style type="text/css">img {width:50px;height:50px;}</style><body><im原创 2017-08-04 00:03:11 · 1592 阅读 · 0 评论 -
从图文混排到浮动之BFC清除浮动
从图文混排到浮动之BFC清除浮动继续上一个疑问，现在p段落的内容是整个包裹住图片的，但如果我既想让p段落的内容显示在img图片的右侧，又想让它布局工整，即从上到下垂直无错位的排列要怎么做呢？为了完成这个格式，我写下了这样一段代码：<html><head><style type="text/css">img {width:50px;height:50px;float:left;}di原创 2017-08-21 22:22:08 · 375 阅读 · 0 评论 -
重新认识font-size、line-height和行高
重新认识font-size、line-height和行高line-height，font-size均是css格式中很常设置的样式，这两个样式会对元素产生什么影响呢？从样式的名字来看，分别代表行高和字体大小的意思，那么line-height真的等于行高吗？font-size又是否和行高有关系呢？基本定义首先来看一些术语的基本定义line-height：line-height属性是指文本行基线之间的距原创 2017-10-25 22:41:27 · 9195 阅读 · 1 评论 -
line-height属性技巧
line-height属性技巧使只含一行内容的段落的文字内容水平居中line-height是一种文本属性，指示行高，浏览器默认的行高较小，通常使段落文字显得比较密集，增加行高可以使段落看上去更加舒服。行高可以以像素作为单位，如(px,em),也可以以百分比作为单位，如下设置行高为基准值的1.5倍p{ line-height:150%}除了疏松文字在高度之间的距离的用途外，行高还可以附带的实现垂原创 2017-10-20 08:44:39 · 5841 阅读 · 0 评论 -
普通块级元素的垂直格式化
普通块级元素的垂直格式化之前写了普通流中块级元素的水平格式化和margin一文，整理了普通流中的块级元素在水平方向的格式化，其中重点介绍了七个和宽度有关的属性（margin-left,border-left,padding-left,width,padding-right,border,margin-right），本文接下来介绍块级元素的垂直格式化以及相关的属性，和水平格式化一样，垂直格式化同样存在原创 2017-11-07 22:22:30 · 340 阅读 · 0 评论 -
合并垂直外边距
在普通块级元素的垂直格式化元素的垂直格式化一文中，我们提到，块级元素在某些情况下会发生垂直方向的外边距的合并，本文来总结一下垂直外边距合并的场景以及如何避免发生垂直外边距的合并。垂直外边距合并的场景两个相邻的兄弟元素 两个相邻的兄弟元素，即当两个元素是相邻的，且是同一个父元素时，上方元素的margin-bottom和下方元素的margin-top会发生垂直外边距合并 2.元素和它的首尾子元素原创 2017-11-08 22:49:30 · 413 阅读 · 0 评论 -
水平居中的几种方法-margin,text-align
水平居中的几种方法-margin,text-align在对元素进行水平居中时，可能会有多种方法，但不同的居中方法的适用场景也可能是不相同的。margin设置为auto来水平居中我们知道，在普通流的块级元素中，元素的七个水平属性相加的和等于包含块的width值，利用这个属性，将margin-left,和margin-width两个值设置为auto,它们会被剩下的值均分，设置为相同的长度（注意width原创 2017-11-06 08:00:55 · 7744 阅读 · 1 评论