css3
丢失的林夕
来个搞笑的:good good study,day day up
展开
-
使图片按比例充满盒子
场景:使图片按比例充满盒子一:css 设置最大宽高max-width:100%;max-height:100%;缺点:图片得大于盒子宽度高,如果小于盒子宽高,将无法填满二::使用css object-fit属性(推荐)height: 100%;width: 100%;object-fit: contain;三:使用js控制图片大小(不推荐使用)...原创 2020-04-18 10:50:14 · 3723 阅读 · 0 评论 -
盒子居中方法
CSS实现盒子模型水平居中、垂直居中、水平垂直居中的多种方法CSS实现盒子模型水平居中的方法水平居中效果图水平居中全局样式.parent {color: #FFFFFF;height: 200px;width: 200px;margin: 0 auto;background-color: #000000;}.child {width: 50px;height: 50px...转载 2019-07-23 23:05:01 · 333 阅读 · 0 评论 -
@media遇到的坑
@media媒体查询必须放在“要重的写样式”之后才能生效如果是引入.css,也要在“要重的写样式”文件之后原创 2019-07-24 12:59:45 · 2857 阅读 · 0 评论 -
多行文字溢出显示...
-webkit-line-clamp 多行文字溢出…一、应用CSS代码:复制代码.box {width: 100px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}复制代码HTML代码: 美国进口Culturelle康萃乐益生菌30...原创 2019-07-22 08:35:51 · 2621 阅读 · 0 评论 -
inline-block水平布局,部局紊乱问题
问题:inline-block盒子布局紊乱原因及决绝办法:出现这个问题的原因归根结底就是inline-block的特性,两个inline-block之间的布局类似两个行内元素,但是可以设置width,height,上下margin。。。类似行内元素布局,两个inline-block元素并排时,没有写明vertical-align时,默认是以baseline对齐的,而inlineblock元素...原创 2019-08-24 22:23:19 · 613 阅读 · 0 评论 -
响应式布局,移动端背景图显示异常问题
问题:响应式布局,移动端背景图显示异常问题**解决办法:将初始缩放比例initial-scale改为0(pc,移动端等比缩放)原创 2019-08-28 13:57:27 · 913 阅读 · 0 评论