本文编辑:小秋同学

DIVCSS 第三章 CSS背景与列表

小秋同学 03-29 10:26:19 网站教程
摘要: 今天是CSS的第三章,主要涉及内容1、CSS 中背景的使用;2、CSS 中列表的使用。一、CSS 中背景的使用属性名称属性值说明background-attachmentscroll设置背景图像会随视窗滚动条的移动而移动。fixed设置背景图像不会随摘要: 今天是CSS的第三章,主要涉及内容1、CSS 中背景的使用;2、CSS 中列表的使用。一、CSS 中背景的使用属性名称属性值说明background-attachmentscroll设置背景图像会随视窗滚动条的移动而移动。fixed设置背景图像不会随

今天是CSS的第三章,主要涉及内容1、CSS 中背景的使用;2、CSS 中列表的使用。

一、CSS 中背景的使用

属性名称属性值说明
background-attachmentscroll设置背景图像会随视窗滚动条的移动而移动。

fixed设置背景图像不会随视窗滚动条的移动而移动。
background-color十六进制background-color:#ff0000;

英文名称background-color:red;

三原色background-color:rgb(255,0,0)

transparentbackground-color:transparent;透明
background-imageURLbackground-image:url("bg.jpg")背景图片

none不设置背景图片
background-positiontop left设置背景图案出现在上左方

top center设置背景图案出现在上方中间

top right设置背景图案出现在上右方

center left设置背景图案出现在中间左方

center center设置背景图案出现在IE中间

center right设置背景图案出现中间右方

bottom left设置背景图案出现在下左方

bottom设置背景图案出现在正下方

bottom right设置背景图案出现在下右方
background-repeatrepeat将背景图案填满整个背景

repeat-x将背景图案在水平方向添满

repeat-y将背景图案在垂直方向添满

no-repeat图案只出现一次



背景图案简化方案:

  1. background: 颜色背景图片 repeat  attachment  position;

复制代码

二、CSS中列表的使用

属性名称属性值说明
list-style-typenone无符号

disc实体的小圆点

circle  空心的小圆点

square实心的小方块

decimal  1,2,3...

lower-romani,ii,iii...  

upper-romanI,II,III...

lower-alphaa,b,c,d,e...

upper-alphaA,B,C,D,E...
list-style-positioninside清单项目较往右移

outside清单项目正常显示
list-style-imageURLlist-style-image:url(lmk.gif)

none不会显示任何图象



清单的简化设置:

  1. list-style:circle inside url("bullet.gif")

复制代码


感谢站帮网提供的分享,本教程归属站帮网提供,如有侵权请联系本站长删除 谢谢

文章版权及转载声明:

编辑:小秋同学本文地址:https://www.qiuhai.com/study/519.html发布于 03-29 10:26:19
文章转载或复制请以超链接形式并注明出处学习吧_一个不错的学习网站
本站文章如没有特殊说明,均采集网上收集,若要转载请务必注明出处,尊重他人劳动成果共创和谐网络环境。 声明:某些文章来源于网络,所采集的到信息本站只为传递信息和分享,不做任何双方证明,也不承担任何法律责任。 文章内容若侵犯你的权益,请联系本站客服删除!

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

阅读
分享

发表评论
加载中~