Use CSS to create a drawer menu _ Experience Exchange
Last Update:2016-05-16
Source: Internet
Author: User
<!doctype HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <ti Tle> advertising </title> <meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/> <meta name=" title "content=" "/> <meta name=" Author "content = ""/> <meta name= "subject" content= ""/> <meta name= "language" content= "en"/ > <meta name= "keywords" content= "/> <style type=" Text/css "> #leftside {float:left; Background-color: #00468C; width:150px; margin:0 Auto; Text-align:center; padding:10px 0;} #leftside. Show_about p.about{Display:block;} #leftside. Meta p.meta{Display:block;} #leftside. Ads p.ads{Display:block;} #leftside a{Display:block;} #leftside a{Text-decoration:none; coloR:black;} #leftside a:hover{background: #FFD7EB URL (images/common/bb_url.gif) no-repeat 10px Center;} #leftside. Class1 a:hover{background: #FFD7EB URL (images/common/bb_url.gif) no-repeat 10px Center;} p.top{background-color: #F9E006; line-height:2;} p.normal{background: #8CC6FF URL (images/common/bb_url.gif) no-repeat 10px Center; margin:10px; font:16px/1.5 song Body;} p.about,p.meta,p.ads{Display:none;} . class1{Display:block; margin:10px 20px; background: #fff URL (images/common/bb_url.gif) no-repeat 10px Center; font : 14px/1.5, the song body;} </style> </pead> <body onload= "" > <p class= "Top" > </p> <p class= "normal" > Home </p> <p class= "Normal" oncli ck= "shq.$ (' Leftside '). classname=shq.$ (' Leftside '). classname== '? ' Show_about ': ' > About us </p> <!--Xuan--<p class= "about Class1 "> Company Introduction </p> <p class=" about Class1 "> Xuan Guang structure </p> <p class= "About Class1" > Xuan Guang advantages </p> <p class= "about Class1" > Publicity and Development </p> <p class= "About Class1" > Xuan Guang Honor </p> <p class= "about Class1" > Advocacy Team </p> <p class= "about Class1" > Cultural Exchange </p> <!--and <p class= "normal" > Company news < ;/p> <p class= "normal" > Service items </p> <p class= "normal" onclick= "shq.$ (' Leftside '). Class name=shq.$ (' Leftside '). classname== '? ' Meta ': ' "> Media </p> <!--media--<p class=" meta Class1 "> Exclusive Media </p& Gt <p class= "meta Class1" > Other media </p> <p class= "meta Class1" > Express bus Load </p> <p class= "meta Class1" > Outdoor Publishing </p> <!--media-- <p class= "Normal" onclick= "shq.$ (' Leftside '). classname=shq.$ (' Leftside '). classname== '? ' Ads ': ' > Successful clients </p> <!--customers--<p class= "ads Class1" > Customer Logos </P&G T <p class= "ads Class1" > Success Stories </p> <!--customers--<p class= "normal" > People Recruitment </p> <p class= "normal" > Contact us </p> </body> </ptml>
