HTML/CSS设置网页背景
创始人
2024-06-02 03:06:12

目录

一、HTML设置网页背景

1.基础设置

 2.背景颜色

3.背景图片

二、CSS设置网页背景


一、HTML设置网页背景

< body >体中使用background和style来设置

1.基础设置

HTML设置页面背景style="background-repeat:no-repeat;background-attachment:fixed;background-size:100% 100%; ">

效果演示

 2.背景颜色

通过style属性:

backgroud-color:transparent   color

transparent : 背景色透明       color : 指定背景颜色

颜色的表达方式有四种:

①直接写颜色单词

②#+十六进制数

③rgb(x,x,x)

④rgba(x,x,x,x)—代表颜色的透明度

3.背景图片

background-img:url():引入图片

background-repeat:

平铺方式:

        (repeat(默认)x轴y轴都平铺、

        repeat-x沿x轴方向重复填充、

        repeat-y沿y轴方向重复填充、

        no-repeat不重复)

backgroud-size:

图片大小:

        (宽 高(设置具体值或者Auto)、

        cover铺满整个盒子,可能会溢出,

        contain在不溢出的前提下尽量铺满屏幕)

background-position:length/position    

        背景图片定位(x轴y轴  用于调整背景图片位置或显示某个位置)
        如果只指定了一个值,该值将用于横坐标。纵坐标将默认为50%。

        第二个值是纵坐标。值可以写英文,可以写数字,也可以是负数。

        该属性定位不受内边距属性(padding)设置的影响。

二、CSS设置网页背景

1.在选择器body体中设置好背景样式(很简单,可以看注释,属性基本与HTML相同)

2.在HTML中引入该css设置(

body{font-family: sans-serif;/*字体加粗*/background-image: url("03lg.jpg");/*背景图片*/background-repeat: no-repeat;/*图片不重复*/overflow: hidden;/*溢出隐藏*/background-size: cover;/*背景覆盖窗口*/
}

相关内容

热门资讯

Meta正式入局个人AI代理赛... 财联社9月10日讯(编辑 赵昊)Meta Platforms推出了一款全新的人工智能代理,旨在帮助用...
兵团20名优秀教师获评特级教师 本报乌鲁木齐讯(全媒体记者 陈琼 常丫丫) 近日,兵团教育局、兵团人力资源和社会保障局联合发布...
打好政策“组合拳” 托起群众... 本报乌鲁木齐讯(全媒体记者 陈琼) “近期看房客户明显增多,叠加住房消费补贴政策带动,成交态势向...
2026显示器排行榜 高清IP... 深夜赶PPT、清晨抢网课、周末剪Vlog、睡前追剧刷番——对大学生而言,一块靠谱的显示器早已不是外设...
最新八G显卡销量排行榜 远程G... 清晨九点,城市写字楼里灯光渐次亮起,一台搭载专业显卡的台式机正悄然加载远程GPU服务——它不追求4K...