Day8字体修饰属性--大小，粗细和倾斜

1.字体大小
image

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字体大小</title>
    <style>
        /* 经验:谷歌浏览器的默认字体大小为16px */
        p{
            /* font-size 属性必须要有单位，否则属性不生效 */
            font-size: 30px;
        }
    </style>
</head>
<body>
    <p>不开的唇</p>
</body>
</html>

image

2.字体粗细
image
数字的符号才是在开发中主要运用的，关键字了解即可

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字体粗细</title>
    <style>
        h2{
            font-weight: 400;
        }
        div{
            font-weight: 700;
        }
    </style>
</head>
<body>
    <h2>我是一辆大洒水车</h2>
    <div>雨夜并不需要我</div>
</body>
</html>

image

3.字体倾斜
image

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字体倾斜</title>
    <style>
        em{
            font-style: normal;
        }
        div{
            font-style: italic;
        }

    </style>
</head>
<body>
    <em>如果你到西街旅店为我带包烟</em>
    <div>无名互胡同拐进十五米是那商店</div>
</body>
</html>

image

posted @ 2025-10-30 16:48  冰涿  阅读(3)  评论(0)    收藏  举报