前端-CSS
关注
分享
扫一扫
ruirui_1996
这个作者很懒，什么都没留下…
展开
-
CSS之未知高度img垂直居中
效果如下：测试代码如下：（能够水平居中，通过text-align:center实现）<style>.box{ width:800px;height:600px;border:2px solid #000; text-align:center;}</style></head><body><div class="box"> <img src="bigptr.jpg" /></div转载 2017-10-04 13:34:02 · 320 阅读 · 0 评论 -
元素浮动之后文字会环绕而不是重合原因
既然浮动元素脱离了文档流，为什么文字会环绕在浮动元素的周边而不是跟浮动元素重合呢？ 为了彻底明白这个问题，必须先弄明白几个问题。 第一，浮动的目的。最初时，浮动只能用于图像（某些浏览器还支持表的浮动），目的就是为了允许其他内容（如文本）“围绕”该图像。而后来的CSS允许浮动任何元素。 第二，绝对定位与浮动的区别。 <body> <div id="container">转载 2017-03-22 20:24:51 · 840 阅读 · 0 评论 -
z-index详解
概念： z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 层级关系的比较 1. 对于同级元素，默认(或position:static)情况下文档流后面的元素会覆盖前面的。 2. 对于同级元素，position不为static且z-index存在的情况下z-index大的元素会覆盖z-index小的元素，即z-index越大优先级越高。 3.转载 2017-03-26 20:52:03 · 484 阅读 · 0 评论 -
css display的用法及原理
最近刚刚开始上手写一点静态网页，看到一些源码中的display属性用的蛮多的，但是我也不太理解原理，只是能看懂，要想用的溜，感觉还是得细究一下，所以有了这篇文章。主要来看一下用的比较多的none，block，inline，inline-block。 w3c对于display 这几个属性的解释 在官方手册里，display属性划分在 css定位属性（Positioning）范畴里，定义是规定元转载 2017-03-27 09:25:39 · 2869 阅读 · 0 评论 -
CSS常见样式及属性
CSS常见样式及属性原创 2017-04-08 22:50:16 · 395 阅读 · 0 评论 -
CSS行高——line-height
初入前端的时候觉得CSS知道display、position、float就可以在布局上游刃有余了，随着以后工作问题层出不穷，才逐渐了解到CSS并不是几个style属性那么简单，最近看了一些关于行高的知识，就此总结一下。所谓行高是指文本行基线间的垂直距离。要想理解这句话首先得了解几个基本知识：顶线、中线、基线、底线<!DOCTYPE html><html> <head> <t转载 2017-03-27 09:37:42 · 408 阅读 · 0 评论