html-two

发布时间 2023-07-16 15:17:58作者: 孤单总是难免的
<!--
1 过
2 过
3 过
4 过
5 过
-------------------
1 过
2 过
3 过
4 过
5 过
-----------------------------
1 过
2 过
3 过
4 过
5 过
----------------------------

-->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <!--引用外部样式表-->
    <link rel="stylesheet" href="路径"/>
    <style>
    /*内联样式表*/
    tr{
        /*指盒子的高度*/
        height: 180px;
        /*盒子的宽度*/
        width: 200px;
        /*字体颜色*/
        color:brown;
        font-size: 18px;
        font-family: "微软雅黑";
        /*加粗*/
        font-weight: 200;
        /*倾斜*/
        font-style: italic;
        font-style: normal;
        /*文字水平居中*/
        text-align: center;
        /*首行缩进*/
        text-indent: 2em;
        /*去掉修饰*/
        text-decoration: none;
        /*加入删除线*/
        text-decoration: line-through;
       


        /*将行类元素转化成块元素*/
        display: block;
       /*将块元素转化成行类元素*/
        display: inline;
 

        /*背景图片*/
        background-image: url("路径");
        /*图像平铺*/
        background-repeat: repeat;

        /*指定位置*/
        background-position: right top;
        /*背景固定*/
        background-attachment: fixed;
        /*背景滚动*/
        background-attachment: scroll;


        /*边框的宽度*/
        border-width:5px;
        /*边框线的风格*/
        border-style: dotted;
        /*边框线的颜色*/
        border-color: orange;
        /*顶部的线*/
        border-top: 1px solid;
       
        /*盒子里面的内容离左边的距离  padding 表示内边距*/
        padding-left: 30px;

        /*盒子离页面顶部的距离*/
        margin-top: 100px;

        /*背景颜值*/
        background-color: green;
         
        /*移动图片在边款内的位置*/
        background-position: 30px 30px;
         
        /*移动块的位置*/
        float:left ;

        /*定位 移动块的位置*/
        position: absolute;

    }
    /*类选择器*/
    .xx{
        font-size: 18px;
    }
    /*id选择器*/
    #s2{
        font-size: 18px;
    }
    /*选择所有*/
   *{
      font-size: 18px;
    }
    /*选择a 连接标签*/
    .xx  a{
        font-size: 18px;
    }
    /*选择li标签*/
    .xx ul li{
        font-size: 18px;
    }
    /*直接下一级*/
    div>a{
        font-size: 18px;
    }
    /*p标签中的class名为xx的标签*/
    p.xx{
        font-size: 18px;
    }
    /*未访问的超链接颜色*/
    a:link {
        color: red;
    }
    /*以访问的超连接颜色*/
    a:visited{
     color:green;
    }
    /*鼠标移动到连接上的颜色*/
    a:hover{
     /*权重最大*/
     color: yellow !important;
    }

    span{
        font-size: 30;
        background-color: blue;
       
    }

    </style>
     
</head>

<body>
   <!--行类样式表-->
    <h2 style="color :red;font-size: 20px;"> 德玛西亚 </h2>
   
    <span>aaaaaaa</span>


</body>