随笔分类 - css

css字数超出显示...

摘要：单行 { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } 多行 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; 阅读全文

posted @ 2024-08-20 17:32 。活着。阅读(41) 评论(0) 推荐(0) 编辑

css过渡

摘要：1、 div {transition: transform .4s;} div:hover {transform: rotate(180deg);-webkit-transform: rotate(180deg); /* Chrome, Safari */} 2、 .animate {positio 阅读全文

posted @ 2024-08-20 17:31 。活着。阅读(2) 评论(0) 推荐(0) 编辑

css使用img后的高度多了4px

摘要：由于img是行内元素，默认display: inline; 它与文本的默认行为类似，下边缘是与基线（baseline）对齐，而不是紧贴容器下边缘。将displayp设置为block即可消除4px的bug。其实解决方法不止一种：1.将图像定义成 img:{display:block;}2.给父级设阅读全文

posted @ 2024-08-20 17:29 。活着。阅读(36) 评论(0) 推荐(0) 编辑

css图片垂直居中

摘要：1、div{display: table-cell; text-align: center; vertical-align: middle;} 2、img{width: 100%; height: 100%; object-fit: scale-down;} 3、图片与文字垂直居中对齐，img{ve 阅读全文

posted @ 2022-05-26 17:33 。活着。阅读(36) 评论(0) 推荐(0) 编辑