css中的盒子是由element、padding、border、margin组成 element:元素内容 padding:内边距:是内容距离内边框的距离 border:边框
盒子的属性
内容的宽度和高度
-
width宽度属性:宽度值|百分比|auto
-
max-width最大宽度属性:宽度值|百分比|auto
-
min-width最小宽度属性:宽度值|百分比|auto
-
height高度属性:高度值|百分比|auto
-
max-height最大高度属性:高度值|百分比|auto
-
min-height最小属性:高度值|百分比|auto
什么样的氧元素可以设置width和height属性
-
块元素
<p>、<div>、<ul>、<ol>、<li>、<dl>、<form>、<hr>、<h1>~<d6>..
-
替换元素
<img>、<input>、<textarea>..
border属性
-
border-width边框宽度属性:thin|medium|thick|值|百分比|auto
-
border-color边框颜色属性:三种颜色表示方法:十六进制数、rgb、字符
-
border-style边框样式:值top、right、bottom、left |none|hidden/solid/dotted...
-
border缩写:宽度|样式|颜色
padding属性
-
padding-top/right/bottom/left:长度值|百分比
margin属性
-
margin-top/right/bottom/left:长度值|百分比|auto
-
margin值为auto可以实现水平方向的居中显示效果
display属性
-
display属性:block|inline|inline-block
-
inline-block将块元素转换为行内块元素(多个块元素在一行显示)
-
block将行内元素(一行显示多个行内元素)转换为块元素(每个元素默认占一行)
-
inline将块元素每个元素默认占一行)转换为行内元素(一行显示多个行内元素)
-
none元素不会显示
-
background属性
-
background属性
-
background-color设置背景颜色 rgb()|16进制|颜色名|transparent透明度|inherit继承父级元素的背景颜色
-
background-image设置背景图片,背景图片和背景颜色都存在的情况,显示背景图片 url(‘URL‘)|none|inherit
-
background-repeat只针对背景图片有效 repeat-x|repeat-y|no-repeat|inherit
-
background-attachment设置背景图片是否固定或者随着页面滚动 scroll|fixed|inherit
-
background-position设置背景图片的起始位置 top left|top right|bottom left|bottom right|center|.....如果只规定了一个值,那么另 一个值为center
-
list-style属性
-
list-style属性
-
list-style-type类型 disc|circle|square|lower-roman|upper-roman|lower-alpha...
-
list-style-position设置列表位置inside|outside|inherit
-
-