CSS小随笔
F_san
前端学习中...
展开
-
CSS常见的浏览器及其内核
CSS常见的浏览器及其内核参考:浏览器及其内核详情通用浏览器:浏览器内核兼容前缀IETrident-ms-EdgeChromiumGoogle ChromeBlink(Webkit分支)-webkie-Firefox 火狐Gecko-moz-Safari 苹果Webkit-webkie-国内浏览器:360、UC、QQ、2345等都为blink。360极速模式:谷歌内核 ; 兼容:IE内核什么?Opera?真不熟:>原创 2021-01-14 15:49:59 · 328 阅读 · 0 评论 -
CSS线性渐变(linear-gradient)浏览器兼容时角度的问题
练习CSS写美团移动端页面时,header部分为渐变色。background: linear-gradient(90deg, #ffd265, #ffbf2e);但是加入浏览器前缀后,并没有按照理想的角度渐变。 background: linear-gradient(90deg, #ffd265, #ffbf2e); background: -o-linear-gradient(90deg, #ffd265, #ffbf2e); background: -ms-linear.原创 2020-08-21 12:07:30 · 1079 阅读 · 0 评论 -
【CSS小随笔】img将父元素撑大3px问题
1、原因img是内联块元素(inline-block),在结束的时候,会在末尾加上一个空白符(匿名文本),这个文本外有一个匿名行级盒子,它默认的vertical-align是baseline的,因为baseline对齐的原因,这个匿名盒子就会下沉,往下撑开一些距离,把父元素撑高。.wrap{ background-color: red;}<div class="wrap"> <img src="../images/pic1.png" alt=""&原创 2020-08-15 09:28:19 · 1113 阅读 · 0 评论 -
【CSS小随笔】高度塌陷及解决方法
1、产生原因 父元素未设置高度,子元素浮动,脱离文档流,父元素高度变为0,影响下方标准流。.wrapper{ width: 300px; border: 2px solid #000;}.box{ width: 100px; height: 100px; background-color: teal; float: left;}<div class="wrapper"> <div class="box"></div><原创 2020-08-13 17:35:03 · 178 阅读 · 0 评论