Html、Css
wzp6010625
尽人事,听天命
展开
-
css3用法
选择器p:first-child // <p>是父级第1个子级p:last-child // <p>是父级倒数第1个子级p:nth-child(n) // <p>是父级第n个子级p:nth-last-child(n) // <p>是父级倒数第n个子级p:nth-child(odd) // 奇数p:nth-child(even) // 偶数p:first-of-type // <p>是父中第一个ph1:原创 2020-12-31 11:15:45 · 103 阅读 · 1 评论 -
margin的bug
如何触发bfc(block format context) a) position:absolute; b) display: inline-block; c) float: left/right; d) overflow: hidden;1.margin塌陷: 父子元素,垂直方向的margin重叠 土办法:给父元素加border-top,不建议用 解决:改变父级渲染规则,让父级...原创 2018-03-14 10:38:29 · 212 阅读 · 0 评论 -
css 样式
/* 毛边 */div{ box-shadow: 0px 0px 5px #888888; /* 水平偏移 垂直偏移 毛边宽度 颜色 */}/* 裁剪元素 */div{ position: absolute; //绝对定位是前提 clip: rect(0px 300px 100px 0px); /* 四个边框到原点的距离, 分别是上 右 下 左 */}/* 旋转 */div{原创 2017-12-12 10:44:16 · 167 阅读 · 0 评论 -
文本与元素的 垂直和水平居中
#text_div{ text-align: center; line-height: 100px; /* 100为自身高度 */}#dom_div{ position: relative;}#dom_cont{ position: absolute; top:50%; margin-top:-25px; /* 自身高度一半 */ left:50%; margin-left原创 2017-10-27 11:37:09 · 267 阅读 · 0 评论 -
解决html设置height:100%无效的问题
关键在于 通常我们需要让自己的网页内容能够更好的适配各种屏幕大小,会采用height:100%,但是我们发现问题出来了,height:100%无效,其实解决办法很简单你只需要在css处添加上html, body{ margin:0; height:100%; }即可。刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,转载 2017-10-15 00:35:07 · 1939 阅读 · 0 评论 -
解决img父元素高度多出3px
1 现象 当div / a……中包含img时,父元素的高度比img图片的高度多出3px<div> <img src=" "><div>123 结果运行之后发现,不管是在移动端还是pc端,都会出现这种问题。刚开始以为是父元素初始化了margin和padding的原因,排查css无果,又怀疑是html空格的原因,把html改成<div>&l...转载 2018-06-17 15:20:50 · 2419 阅读 · 1 评论