CSS3背景
1.背景的五种基本属性 background-color(背景颜色) background-image(背景图片) background-repeat(背景图片展示方式) background-attachment(背景图片是固定还是滚动) background-position(背景图片位置) 综合使用:background:[<background-color>][<background-image>][<background-repeat>][<background-attachment>][<background-position>]
2.background-color属性 语法:background-color:transparent || <color> transparent:透明色 color:颜色名、rgb色、hls值、十六进制值、rgba色、hsla值
3.background-image属性 语法:background-image:none || <url> none为默认值,没有的意思 url:图片地址,可以是相对地址,也可以是绝对地址
4.background-repeat属性 语法:background-repeat:repeat || repeat-x || repeat-y || no-repeat repeat:背景图片沿X轴和Y轴方向平铺 repeat-x:背景图片沿X轴方向平铺 repeat-y:背景图片沿Y轴方向平铺 no-repeat:背景图片不做任何平铺
5.background-attachment属性 语法:background-attachment:scroll || fixed scroll:背景图片随着页面的其余部分滚动 fixed:背景图片固定不动 注:取值fixed时,运用在html或body标签上,使用在其他标签不能达到固定效果
6.background-position属性 语法:background-position:[percentage] || [length] || [left | center | right] || [top | center | bottom] 作用:用来设置背景图片的位置 默认值:(0,0) || (0%, 0%) || (left top),其值可以是具体的百分数或数值设置(可以是负值),也可以使用关键字left、center、top、right、top、bottom配合设置,个属性定位方式:
CSS3背景的更多相关文章
- CSS3背景温故
1.背景的五种基本属性background-color(背景颜色)background-image(背景图片)background-repeat(背景图片展示方式)background-attachm ...
- css3 背景记
css3 背景 css背景主要包括五个属性: background-color background-color:transparent || <color> 用来设置元素的背景颜色,默认 ...
- CSS自学笔记(11):CSS3背景和边框
CSS3 背景 在CSS3中新增了多个关于背景的属性,可以让我们对背景有了更多更好的操作,减少用第三方工具对背景图片进行修改美化. CSS3中主要是通过定义backgrounp中的各个属性来控制背景( ...
- 第七十九,CSS3背景渐变效果
CSS3背景渐变效果 学习要点: 1.线性渐变 2.径向渐变 本章主要探讨HTML5中CSS3背景渐变功能,主要有两种渐变方式:线性渐变和径向 (放射性)渐变. 一.线性渐变 linear-gradi ...
- 从零开始学习前端开发 — 17、CSS3背景与渐变
一.css3背景切割: background-clip:border-box|padding-box|content-box; 作用: 用来设置背景的可见区域 a) border-box 默认值,背景 ...
- css3背景颜色渐变属性 兼容性测试基础环境为:windows系统;IE6.0+, Firefox4.0+, Chrome4.0+, Safari4.0+, Opera15.0+
css3背景颜色渐变属性 兼容性测试基础环境为:windows系统:IE6.0+, Firefox4.0+, Chrome4.0+, Safari4.0+, Opera15.0+ 语法: <li ...
- [转]真正了解CSS3背景下的@font face规则
本文转自:http://www.zhangxinxu.com/wordpress/2017/03/css3-font-face-src-local/ by zhangxinxu from http:/ ...
- css3 背景background
Css3背景<background> Css3包含多个新的背景属性,它们提供了对背景更强大的控制.可以自定义背景图的大小,可以规定背景图片的定位区域,css3还允许我们为元素使用多个背景图 ...
- CSS3背景 制作导航菜单综合练习题
CSS3背景 制作导航菜单综合练习题 小伙伴们,根据所学知识,使用CSS3实现下图的导航菜单效果 任务 1.制作导航圆角 提示:使用border-radius实现圆角 2.制作导航立体风格 提示:使用 ...
- css3-3 css3背景样式
css3-3 css3背景样式 一.总结 一句话总结:网站页面上的小图标集成在一张大图上面,是因为降低服务器负载,网站上的那些图片都可以下载下来,源码那里,或者工具那里. 1.background:# ...
随机推荐
- js多个输入框运算计算结果输出到另一个输入框
<div id="ckjrzy_4_14_15"> <div id="ckjrzy_4_14_17">收益计算器 </div& ...
- (原创)Windows系统后安装ubuntu,无法选择启动ubuntu。
继Window系统之后,安装Ubuntu系统. 问题:启动没有Grub的ubuntu启动项. 查看:/boot/grub/中只有txt和env,内容空白,grub没有设置好. 修复: sudo fdi ...
- jQuery Length属性
Length属性 属性用于返回当前jQuery对象的元素个数. 语法 jQueryObject.length 返回值 Number类型 返回该jQuery对象封装的DOM元素的个数. 实例说明 代码 ...
- repeater重复器、地址栏传值、response
repeater重复器: <HeaderTemplate> <ItemTemplate> <AlternatingItemTemplate> <FooterT ...
- myeclipse连接oracle步骤
1.加载ojdbc.jar驱动(路径:E:\myoracle\oracle\product\11.2.0\dbhome_1\jdbc\lib) 2.String url = "jdbc:or ...
- MVC使用Membership配置
MVC的权限管理,环境是MVC4.5,SQL Server2008 修改前 Web.config文件: <system.web> <authentication mode=" ...
- IDEA建立---- java web项目
1.新建一个javaweb项目 2.给项目命名 3.建立完的项目结构大概是这样(在web 下新建 两个目录lib 和 classes) 4.找到project Structure---------&g ...
- mybatis中 ${}和#取值小记(Parameter index out of range)
mybatis mapperxml文件中有两种取值法.${}和#{} $的是原样,#的是取值并转成指定?#{ele1,jdbcType=VARCHAR} 有个坑, 错误的写法 <if test= ...
- MySQL 解压包 安装
1.解压 2.配置mysql bin的环境变量 3.配置my-defalue.ini 配置文件 或自己建立一个my.ini文件 [mysqld] basedir=F:\mysql\mysql-5.6. ...
- js刷新框架子页面的七种方法代码
面以三个页面分别命名为framedemo.html,top.html,button.html为例来具体说明如何做.其中framedemo.html由上下两个页面组成,代码如下: <!DOCTYP ...