HTML和CSS布局中的奇葩问题
文章平均质量分 66
泠泉石上
我是一个小白
展开
-
line-height与vertical-align使用时发现的问题
垂直居中是网页布局中经常要用的技巧,尤其是会涉及到line-height属性和veitical-align属性。我在使用的过程中发现了这样一个问题。 .a{width: 400px;height: 200px;background:red;text-align: center;line-height: 200px;} .b{width: 200px;height:100px;background: yellow;}原创 2016-08-24 15:09:38 · 415 阅读 · 0 评论 -
元素脱离普通文档流后特点及问题总结
在使用float,position:absolute | fixed属性之后元素会脱离普通文档流,与inline-block和position:relative不同,后两者还在普通文档流中。对于行内元素来说,允许行内元素使用原本不能使用的width,height,margin-top,margin-bottom,padding-top,padding-bottom属性。元素脱离普通文档流后原创 2016-08-28 14:59:47 · 2489 阅读 · 0 评论 -
margin塌陷及处理
什么是margin塌陷,margin塌陷是指在使用margin布局时,特定情况下导致margin高度与代码中设计的高度不同。如1..outside{ width: 100px; height: 100px; background: red;}.inside{ width: 50px; height: 50px; background: green; margin-原创 2016-08-28 16:33:14 · 2656 阅读 · 0 评论 -
li标签水平布局时莫名其妙的间距
在写前端的时候经常要用到标签水平平铺。今天聊一聊出现的一个莫名其妙的边距问题和解决办法。啥也不说,直接代码 *{margin: 0px;padding: 0px;} li{display: inline;background: red;} 1 2 3 4 5 6 7我明明设置了margin为0的,可是还是有边距。。。楼主哭了。。。研究一下原来是回车的原因。浏览原创 2016-08-24 14:41:11 · 4001 阅读 · 0 评论