CSS 常用属性

• 一般在使用 CSS 样式的时候，通过它带有的众多属性去设置想要的效果。

1. 字体

font-size 设置字体大小 浏览器默认最小字体为12px
font-weight 设置文本粗细
	normal 默认 bold 加粗 
font-style 设置字体是否倾斜
	normal 默认 italic 倾斜
font-family 字体文本
	类似 宋体,sans-serif;
组合写法
 font: font-style font-weight font-size/line-height font-family

line-height 这个属性用来设置行高

2. 颜色

color: 用于设置字体的样式
backgroun-color: 设置背景颜色
	都可以通过 英文red 或16进制 #ffffff rgb(255,255,199)
backgroun-image:url() 设置背景颜色 逗号分割可以设置多个
backgroun-origin: 指定背景图片的位置
	border-box 背景图的位置以border区域为参考
	padding-box 背景图的位置以padding区域为参考
	content-box 背景图的位置以content区域为参考
background-position:设置背景图片的初始化位置
	top、left、center 或者百分百的形式都可以设置
backgroun-repeat: 设置背景图片重复方式，可以沿着水平抽、垂直抽，两个轴重复或更不不重复
	repeat-x repeat space round 这些都是可以设置背景图片重复出现的，可以自行调式看看
	no-repeat 不允许图片重复 
backgroun-size: 设置图片大小尺寸，可以拉伸尺寸
	auto 默认 cover 图片完全覆盖背景区
	contain 是尽可能的保证图片的宽高比例 可能会留空白
	也可以通过百分百去设置大小

组合写法
backgroun:backgroun-color background-image background-repeat background-size

3. 文本

• 我们一般也会对文本做一些设置处理，比如对齐方式、宽、高、边距

text-align:left|content|right 设置文本对齐方式
border: 设置边框宽度、样式和颜色
	border:1px solid #000;
margin: 设置元素的外边距距离最进一层的距离
padding: 设置元素内容区域的位置
height: 设置元素的高度
width: 设置元素的宽度
z-index: 设置元素的层级
float: 设置元素浮动，会脱离文档流，直到碰到边框或另一个浮动元素
	left right 浮动方向
display: 设置元素的显示方式、块元素、行内元素、行内块元素
	block 设置为块元素
	inline 设置为行内元素
	inline-block 设置为行内块元素
	none 会把元素进行隐藏
position: 设置元素定位
	relative 相对定位
	absolute 绝对定位
	fixed 固定定位

清除一下默认样式
box-sizing:border-box; 设置元素的总宽、高包含内边距和边框
list-style:none 清除li小圆点的默认样式
text-decoration: none; 清除下划线，比如a标签的下划线
			underline 设置下划线
			 line-through 设置中划线

隐藏属性 用于隐藏标签元素
display: 
	none: 元素隐藏，不会占用页面的空间
	flex: 将元素设为弹性容器。
	grid: 将元素设为网格容器
visibility:
	visible：元素可见
	hidden：元素不可见，但仍会占用页面的空间
	collapse： 元素被折叠，用于表格行和列
opacity
	属于控制元素的透明度，取值范围0-1之间

伪元素 作为已选择元素子元素的第一个或最后一个
::before{content:"";display:block;clear:both;}
::after{content:"";display:block;clear:both;}
	content 是用于装饰内容  伪元素默认行内元素
	clear 用于清除浮动带来的样式丢失

4. 盒子模型

• 在对元素进行样式操作时，使用标签也会默认他们的类型
  • 块元素因独占一行的原因可以设置其宽高
  • 行内元素则不行 因为他的内容是由内容撑开，
  • 可以把各个标签看成一个个盒子，每个盒子都由以下部分组成
  • 而行内块是有了块元素的优势并且不会独占一行，但是一般用的也不多
  • 而如果同时两个相邻元素设置外边距的会产生合并 只留外边距最大的那条

未完待续…