bgc,bgi-第六天

背景颜色 background-color

• 颜色取值

  • 关键字
  • rgb表示法
  • rgba表示法
  • 十六进制

• 背景颜色默认值是透明:rgba(0,0,0,0),transparent

• 背景颜色不会影响盒子大小,并且还能看清盒子的大小和位置,一般在布局中会习惯先给盒子设置背景颜色

背景图片 background- image

• 背景图片默认是在水平和垂直方向平铺的

• 取消平铺 background-repeat:no-repeat

• url可以不用双引号

背景位置　background-position

• background-position:0px 0px 第一个值 具体方向值 第二个值 具体水平值
• background-position: bottom right 跟具体的方向值

背景属性复合写法

• background:color image repeat position

• 没有顺序要求 没有省略要求

• 如果代码中有复合写法,其他单独属性要卸载复合写法的下面

块级元素

• 块级元素默认宽度为父元素宽度
• 块级元素独占一行
• 块级元素可以直接设置宽高
• 代表标签:div p h li ul
• display:block

行内元素

• 行内元素大小默认由内容撑开
• 一行显示多个
• 不能设置宽高
• 代表标签:a span 8个文本格式标签
• display:inline

行内块元素

• display:inline-block
• 一行显示多个
• 可以设置宽高
• 代表标签:表单标签

特殊img

• img虽然是行内元素,但是具有行内块元素的特点