html+css_02

扶夙

已于 2022-01-18 21:51:52 修改

阅读量119

点赞数 1

分类专栏： HTML 文章标签： css html css3

于 2022-01-14 17:47:08 首次发布

本文链接：https://blog.csdn.net/lijiaxuan_/article/details/122499317

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

14.渐变色：inear-gradient(90deg, red, blue,yellow);

15.border-radius: 5px; 圆角

16.box-shadow: 3px(水平方向向右多少) 3px(垂直方向向下多少) 10px(向外扩散多少) red; 阴影

17.text-align: center;文字居中

18.font-size: 30px;字体大小

19.opacity: 0.6;透明度

20.line-height: 30px;行高

21.class 可以一次命名好几个，只需要用空格隔开

<div class="st2 chosed">3</div>

22.
是换行

23.点击F12，再点sources可以在里边找网页上的图片
点Network在刷新这个页面，可以看到这个页面调用的所有东西
登录之后的钥匙放在Application->cookies中

24.transform: rotate(*deg);旋转*度

25.加一个小三角可以建一个正方形的div然后旋转45度

26.display:none;是隐藏
display:block;是显示
具体实例：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .st1 {
            height: 300px;
            width: 90%;
            background-color: #2ac;
            margin-left: 5%;
            margin-top: 50px;
            border-radius: 10px;
            box-shadow: 0px 0px 25px;
            text-align: center;
            color: #fff;
            font-size: 80px;
            opacity: 0.6;
            line-height: 300px;
            padding: 20px;
        }
    </style>

</head>

<body style="background-image:url('images/aa.png');background-size: cover;">
    <div class="st1">科比·比恩·布莱恩特</div>
    <input type="text">
    <input type="button" value="确定">
</body>


</html>

扶夙

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html+css_02

14.渐变色：inear-gradient(90deg, red, blue,yellow);15.border-radius: 5px; 圆角16.box-shadow: 3px(水平方向向右多少) 3px(垂直方向向下多少) 10px(向外扩散多少) red; 阴影17.text-align: center;文字居中18.font-size: 30px;字体大小19.opacity: 0.6;透明度20.line-height: 30px;行高具体实例：<!DOCTYPE html
复制链接

扫一扫