CSS(二)-按钮设置其实很简单，你还不会吗？

设置按钮

 <span>登&nbsp;&nbsp;&nbsp;录</span>
        
        <style>
        	span{
	        	    border: 1px solid #e85356;
			    display: inline-block;
			    width: 302px;
			    background-color: #e4393c;
			    height: 31px;
			    line-height: 31px;
			    text-align: center;
			    color: #fff;
			    font-size: 20px;
			    font-family: 'Microsoft YaHei';
			    cursor: pointer;
        	}

为按钮设置：当鼠标移上去的时候改变背景

        	span:hover{
        		background-color: mediumvioletred;
        	}
        </style>

• a标签引入链接默认是有下划线的 

     <style>
        	a{
        		font-family: "PingFang SC","Microsoft YaHei",arial,"Hiragino Sans GB","Hiragino Sans GB W3";
        		/*
        		 * text-decoration:去除下划线
        		 */
        		text-decoration: none;		
        		color: black;
        		font-size: 14px;
        	}
        	/*
        	 * hover:为字体设置鼠标移上去加下划线和背景颜色
        	 */
        	a:hover{
        		text-decoration: underline;
        		color: green;
        	}
        </style>

• 注意 

1. text-decoration：去除下划线
2. hover：为字体设置当鼠标移上去的时候加上下滑线和背景色 

CSS伪类

• CSS 伪类用于向某些选择器添加特殊的效果

1. :link-向未被访问的链接添加样式

2. :visited-向已被访问的链接添加样式

3. :hover-当鼠标悬浮在元素上方时，向元素添加样式

4. :active-向被激活的元素添加样式

• 若:link、:visited、:hover和:active一起使用，:hover 必须被置于 :link 和 :visited 之后，:active 必须被置于 :hover 之后，即:link -> :visited -> :hover -> :active 
• link和visited必须和a标签一起使用，hover和active则不一定

        <style>
        	a:link{
        		background-color: red;
        	}
        	a:visited{
        		background-color: black;
        	}
        	
        	a:hover{
        		background-color: while;
        	}
        	a:active{
        		background-color: yellow;
        	}
        </style>