CSS小章节认识

最新推荐文章于 2023-03-10 11:10:33 发布

赵剑华

最新推荐文章于 2023-03-10 11:10:33 发布

阅读量129

点赞数

本文链接：https://blog.csdn.net/zhaojianhua1997/article/details/102948467

版权

溢出省略号：
overflow:hidden;
text-overflow:eclipse;
white-space:nowarp;
在这里插入图片描述

.seckill-main ul li h5{
    height: 30px;
    line-height: 30px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    color: #333;
    font-weight: normal;
}`

前后插入：
::before /::after
{
content:"";}
在这里插入图片描述

.ms-right div::before{
    content: "";
    height:1px;
    width: 60px;
    background:linear-gradient(270deg,transparent,#fff,#eee,#eee,#fff,transparent);
    position: absolute;
    left:2px;
    right:2px;
}

linear-gradient(270deg,red,yellow,green,pink) 线性渐变
在这里插入图片描述

在这里插入代码片<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        div{
            width: 200px;
            height: 100px;
            background: linear-gradient(270deg,red,yellow,green,pink);
        }
    </style>
</head>
<body>
<div></div>
</body>
</html>