web实训总结___0319

练习：导航栏

方法一：div实现

 1. 
 2. 
 3. 
 4.     
 5.     
 6.     
 55.     
 56. 
 57.  

 58.      
< a href=" ">首页Home
 59.      
< a href="#">课堂大厅Course
 60.      
< a href="#">学习中心Learn
 61.      
< a href="#">关于我们About
 62.  
 63.  
 64. 

*知识点（同下）

方法二：ul li实现

 1. 
 2. 
 3. 
 4.     
 5.     
 6.      
 59. 
 60. 
 61. 

 62.      

 63.      
< a href=" ">首页Home
 64.      
< a href="#">课堂大厅Course
 65.      
< a href="#">学习中心Learn
 66.      
< a href="#">关于我们About
 67.  
 68. 
 69. 

代码实现：

知识点：

float属性:

1.float属性定义DIV的浮动方式，有三种取值方式：none，left，right
2.当float属性值取为left时，div会向左浮动，其他的div显示方式和浏览器相关。
3.当float属性值取为right时，div会向右浮动。

CSS页面布局：

属性	描述
display	设置元素显示类型
float	规定元素是否应该浮动
clear	规定元素的哪一端、侧不允许其他浮动元素
visibility	规定元素是否可见，与display不同，此属性为隐藏的对象保留其占据的空间
overflow	设置当元素的内容溢出时处理方式
overflow-x	设置当元素的内容横向溢出时处理方式
overflow-y	设置当元素的内容纵向溢出时处理方式

备注：页面布局常见相关属性：

1.float（left，right，auto）
2.display（block，inline，inline-block，listitem）
3.display（block，inline，inline-block，listitem）

overflow 的值描述：
1.visible — 默认值。内容不会被修剪，会呈现在元素框之外。
2.hidden —内容会被修剪，并且其余内容是不可见的。
3.scroll — 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
4.auto — 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
5.inherit —规定应该从父元素继承 overflow 属性的值。