Tutorial on helping customers (www.bkjia.com)In the previous tutorial, we once talked about an article titled "automatically switch the mouse over a Tab". In this article, we have already introduced three forms of tabs similar to IE browser. Coincidentally, I once again read this example in the blog Park today, so I will share it with you again. I hope that our webmasters and site Builders will continue to support the customer's house and we will do better!
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <Html xmlns =" http://www.w3.org/1999/xhtml "> <Head> <title> Use css and js to implement the Tab-LIEHUO. NET) </title> <style type = "text/css"> ul # tabNav {width: 400px; list-style: none; border-bottom: solid 1px green; margin: 0; padding-left: 0; padding-bottom: 26px; // The results can be displayed normally on the google browser, but IE7 does not work, so the following sentence * padding-bottom: 0; // IE7 support} ul # tabNav li {float: left; height: 25px; margin: 0 10px-2px 0; // Key location background-color: Green; color: black; border: solid 1px Green; border-bottom: 0; padding: 0;} Ul # tabNav a: link, ul # tabNav a: visited {display: block; text-decoration: none; padding: 5px 10px 3px 10px;} # tabContent {width: 400px; height: 200px; border: solid 1px green; border-top-width: 0 ;}# tabNav li. tabSelected {border-bottom: solid 1px white; // Key location background-color: White; color: Black ;} </style>
Tip: the code can be modified before running!
Original article: blog Park.