CSS常用操作

CSS常用操作

1. 对齐
   
   显示效果
   
   学习：可以调节margin外边框来设置对齐，然后可用auto自适应来设置居中。
   PS：也可以使用position和float进行向左对齐或向右对齐。
   
2. 文字尺寸
   
   显示效果
   
   学习：可以使用line-height来设置行高，如200%和50%；可以用width来规定每行的长度，不裁剪单词；max-width和min-width分别为最大和最小行长度。
3. 列表
   
   显示效果
   
   学习：列表用display: inline 可以横置做导航栏使用；visibility可设置为visible（可见）和hidden（不可见）。
4. 导航栏

• 垂直导航栏
  
  显示效果
  
  学习：利用text-decoration: none可以使下划线消失；利用list-style-type: none可以使实心圆点消失；display: block可以使元素显示为块级元素，自带换行符；借由a:active和a:hover可以使鼠标指向链接时，链接产生效果，图中为背景颜色改变。

• 水平导航栏
  
  显示效果
  
  学习：利用display: inline可横置列表作为水平导航栏；利用padding和text-align调节链接之间的距离。

5. 图片
   
   显示效果
   
   
   学习：利用float: left可以使边框不会包括图片右边空白部分；opacity可以调节图片的透明度由0到1（数字越大越不透明），小数形式；可用a:hover来设定鼠标指向图片链接时，图片链接产生效果，图中为背景颜色改变。