guorui
/
html_learn


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css常见属性</title>
    <style>
      #css2{
        /*字体颜色*/
        color: #eb7350;

        /*字体*/
        font-family: FangSong;

        /*字体粗细*/
        font-weight: bold;

        /*字体底色*/
        background-color: #eb7350;

        /*行高*/
        line-height: 40px;


      }


    </style>
</head>
<body>


    <h3 style="font: caption;">font的复合属性</h3>
    <h3 style=";">font的复合属性</h3>

<h1>行内元素、块级元素、行内块级元素的相互转换</h1>

    <h5 style="color: #ff5722">
        <p>1.使用style="display: inline"转换为行内元素</p>
        <p>2.style="display: block"转换为块级元素</p>
        <p>3.style="display: inline-block转换为行内块级元素"</p>
    </h5>
    <hr>
copyright: <p>Copyright &copy; 2022~ <script>document.write(new Date().getFullYear());</script> <a href="https://grd.net.cn" target="_blank">G.R.D</a> All Rights Reserved.</p> # 左下角的版权声明


<div style="background-color: #a1aec6;width: 100px; height: 100px">
        这是一个块级元素
</div>

<div style="display: inline; background-color: #d3ffe2;width: 100px; height: 100px">
        这是一个块级元素
</div>
<div style="display: inline-block; background-color: #fbd3ff;width: 100px; height: 100px">
        这是一个块级元素
</div>

</body>
</html>