lovecoding
/
W250511


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* div{
            width: 400px;
            height: 400px;
            border:5px solid red; */
            /* 溢出部分隐藏 */
            /* overflow: hidden;
        } */

        .box{
            width: 200px;
            height: 200px;
            border: 3px dashed red;
            /* 强制文本不换行 */
            text-wrap: nowrap;
            /* 溢出部分隐藏 */
            overflow: hidden;
            /* 文本溢出显示省略号 */
            text-overflow: ellipsis;
            /* 阴影 一共有4个值 第一个值水平阴影的位置，第二个值垂直阴影的位置，第三个值模糊距离，第四个值阴影的颜色， */
            box-shadow: 30px 30px 10px black;
        }
    </style>
</head>
<body>
    <div class="box">
        样式表定义如何显示 HTML 元素，就像 HTML 中的字体标签和颜色属性所起的作用那样。样式通常保存在外部的 .css 文件中。我们只需要编辑一个简单的 CSS 文档就可以改变所有页面的布局和外观。
    </div>
    <del>原价188</del>
    <!-- <div>
        <img src="./image/img1.jpg" alt="img">
    </div> -->
</body>
</html>