3.4背景图片位置

最新推荐文章于 2024-06-21 08:52:31 发布

这一片月

最新推荐文章于 2024-06-21 08:52:31 发布

阅读量62

点赞数

分类专栏： css样式文章标签： css html

本文链接：https://blog.csdn.net/qq_62865634/article/details/126688525

版权

css样式专栏收录该内容

41 篇文章 1 订阅

订阅专栏

提示：表示背景图片位置混合单位，有精确单位、也有方位名词。

1、语法：

div{

background-position：20px center；

}

解释：

20px表示是精确单位

center表示是方位名词

自己代码展示：

<!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>混合单位</title>
    <style>
        body {
            background-image: url(wzbj.jpg);
            /* 表示图片背景 */
            background-repeat: no-repeat;
            /* 这个表示平铺背景 */
            background-position: 20px center;
            /* 图片位置方向 */
            /* 这个就是混合单位：
            第一个x轴表示20px表示像素；
            第二个y轴表示center表示混合位置 */
        }
    </style>
</head>

<body>

</body>

</html>

显示结果：