Make your own navigation page and act now! _html/css_WEB-ITnose

I believe everyone has used navigation websites, and I am no exception. However, one day I suddenly thought, why not make a navigation for myself? There used to be so many local or online APIs, and it took me a long time to find them every time I used them. Now I have built a small navigation page, which is clear at a glance, haha!

This is the source code of my navigation page, a sincere gift:

< html xmlns = "http://www.w3 .org/1999/xhtml" >

< head >

< meta http-equiv = "Content-Type" content = "text/html; charset=GB2312" / >

< title >My Homepage

< style type = "text/css" >

.main {

margin-top: 50px;

background-color: #D9FF99;

.title {

font-size: 40px;

color: #CC6633;

font-family: "汉正光典", "小元", "Microsoft亚黑", sans-serif;

text-shadow: 2px 2px 2px rgba(200, 200, 200, 0.5);

.content ul {

display: block;

width: 960px;

height: 400px;

list-style-type: none;

margin: 0;

padding: 20px 0px;

.content li {

display: block;

width: 192px;

height: 100px;

float: left;

text-align: center;

font-family: consolas,"Microsoft Yahei", sans-serif;

font-size: 24px;

.content li a {

display: block;

width: 140px;

height: 60px;

color: white;

text-align: center;

line-height: 60px;

background-color: green;

text-decoration: none;

margin: 18px 25px; : 1px solid #CCC;

.content li a:hover {

background-color: #0C0C35;

< body >

< table width = "960" border = "0" cellpadding = "0" cellspacing = "0" class = "main " align = "center" >

< tr >

         < table  width = "960"  border = "0"  cellspacing = "0"  cellpadding = "0" >

             < tr >

             < td  width = "382" >< img 

             src = "http://images.cnitblog.com/blog/343602/201310/28113106-18da6293d7a44fed97ce8b1dadaa6c30.jpg"

             width = "382"  height = "101"  border = "0" />

             < td  width = "578"  align = "center"  bgcolor = "#D5EDB3" >< span  class = "title" >我 的 主 页

            

        

    

< tr  height = "10" >

     < td  bgcolor = "#004000" >

< tr >

     < td  class = "content" >

         < ul >

            

             < li >< a  href = "jquery/index.html" >jQuery

             < li >< a  href = "android/index.html" >Android

             < li >< a  href = "hibernate/index.html" >Hibernate

             < li >< a  href = "groovy-api/index.html" >Groovy

             < li >< a  href = "grails/index.html" >Grails

             < li >< a  href = "five/index.html" >HTML5

             < li >< a  href = "bootstrap/index.html" >Bootstrap

         < ul >

    

 

这就是最终效果：