HTML 超链接文本修饰背景属性

１链接伪类

a:link{属性:值;} a{属性:值}效果是一样的。

a:link{属性:值;} 链接默认状态

a:visited{属性:值;} 链接访问之后的状态

a:hover{属性:值;} 鼠标放到链接上显示的状态 a:active{属性:值;} 链接激活的状态

a:focus{属性:值；} 获取焦点

文本修饰

text-decoration: none | underline | line-through

         a{
             color:red;
             text-decoration: none;        //设置无下划线
         }
            a:focus{
                color:orange;
            }
            a:hover{
                color:yellow;
                text-decoration: underline;       //设置加入下划线
            }

案例：

        <style type="text/css">
        .nav{
        height:40px;
         background-color=#aaa;
         text-align:center;
        }
         a{
             display: inline-block;
             width:80px;
             height:40px;
             text-decoration: none;
             color:#000;
             font-weight:700;
         }
         a:hover{
           background-color:#eee;
           text-decoration: underline;

         }
          a.public{

               font-weight:700;
               color:#f14400;
          }

        </style>
    </head>
    <body>
    <div class="nav">
     <a href="#" class="public">天猫</a>
     <a href="#" class="public">聚划算</a>
     <a href="#"  class="public">超市</a>
     <a href="#"  class="public">头条</a>
     <a href="#">阿里旅行</a>
     <a href="#">电器城</a>
     <a href="#">淘抢购</a>
     <a href="#">苏宁</a>
     <a href="#">智能生活</a>

==================================================

背景属性

１.1 background-color 背景颜色

１.2 background-image 背景图片

１.3 Background-repeat repeat(默认) | no-repeat | repeat-x | repeat-y 背景平铺

１.4 Background-position left | right | center | top | bottom 背景定位

    <style type="text/css">
      .box{
          height:500px;
          background-color:#999;
          background-image:url("2.png");
          background-repeat:repeat-y;
      }

    </style>
</head>
<body>
    <div class="box"></div>