一,效果图。
二,代码。
<!doctype html> <html> <head> <meta charset="utf-8"> <title>css backgrounds</title> <style> h1 { background-color: #6495ed; } p { background-color: #e0ffff; } div { background-color: #b0c4de; } body { background-image: url('paper.gif'); background-color: #cccccc; background-repeat: no-repeat; background-position: right top; margin-right: 200px; } body { background: #ffffff url("img_tree.png") no-repeat right top; margin-right: 200px; } </style> </head> <body> <h1>css background-color实例!</h1> <div>改文本插入在div元素中.</div> <p>该段落有自己的背景颜色</p> <p>背景图片不重复,设置position实例</p> <p>背景图片只显示一次,并与文本分开</p> <p>实例中还添加了margin-right属性用于让图片与文本间隔开</p> </body> </html>
参考资料:《菜鸟教程》
如对本文有疑问, 点击进行留言回复!!
清除新版Google Chrome浏览器中表单控件(input,button...)默认的黑色边框
荐 20200714——git/mac配置/项目运行步骤/一些报错
antd 菜单组件 使用时报错:Cannot read property ‘isRootMenu‘ of undefined
CSS|div的style=“background-image: url(img/a.bmp)图片显示不出来
硬件仪表盘账号建立指导(一) --WHQL认证测试结果提交账号(一)
cookie的规范Cookie的不可跨域名性或Cookie与域名的关系
网友评论