昨日学习css背景设置

Ara~追着风跑 2022-01-15 08:10:51
<!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>css背景</title>
    <style>
        /* <!-- 通过css背景属性,可以给页面元素添加背景样式 --> */
        /* <!-- 背景属性可以设置颜色,背景图片,背景平铺,背景图片位置,背景图像固定等  */
        /*背景颜色 background-color:颜色值; */
        /* 一般情况下元素背景颜色默认值是transparent(透明),我们也可以手动指定背景颜色为透明色 */
        
        div {
            width: 400px;
            height: 400px;
            background-color: 颜色值;
        }
        /* 2.5.2背景图片 */
        /* background-image属性描述了元素的背景图像实际开发常见于logo或者一些装饰性的小图片或者是超大的背景图片,
        优点是非常便于控制位置(精灵图也是一种运用场景) */
        /* 利用back...position属性可以改变图片再背景中的位置 */
        
        div {
            background-image: none/url(../songyangjie/1.1img.jpg);
        }
        
        div {
            /* background-position: x(方位名词) y(精确单位); */
            background-position: center top;
            /* background-position: top center; */
        }
        /* 参数是方位名词
        如果指定的两个值都是方位名词,则两个值前后顺序无关,比如left top和top left 一致
        如果水平靠右侧对齐,第二个参数省略y轴是垂直居中显示的(也就是省略的那个值默认居中对齐)*/
    </style>

</head>

<body>
    <div></div>
</body>

</html>

 

...全文
7 回复 7 打赏 收藏 举报
写回复
回复
切换为时间正序
请发表友善的回复…
发表回复
相关推荐
发帖
哪吒社区
加入

4.5w+

社区成员

我命由我不由天,来吧,和哪吒一起奋发图强,搬砖工逆袭Java架构师!
帖子事件
创建了帖子
2022-01-15 08:10
社区公告

【Java技能树】和哪吒一起,打卡100天,每天分享一个知识点,一起学习,一起进步,告别CRUD,搬砖工逆袭Java架构师,加油!

【积分榜】积分榜前十每周都有精彩礼包赠送!

【添加微信】备注1024,赠送Java学习路线思维导图