<p class="sougouContent"> </p> <p class="tag"> Navigation CSS Compatibility </p> Incompatible in Chrome and Safari, Chinese cannot be displayed after the mouse is rolled over, other browsers are normal <br> <h2>Reply to the discussion (solved Solution)</h2> <p class="sougouAnswer"> The code is as follows<br> <!DOCTYPE html> <br> <html xmlns="http://www.w3.org/1999/xhtml"> <br> <head> ; <br /> <meta http-equiv="Content-Type" content="text/html" charset="utf-8"> <br> <style> <br> html, body, iframe,h1, h2, h3, h4, h5, h6, p, ol, ul, dl, dd,input, button,select, textarea, th, td, form { margin: 0; padding: 0;} <br> ol,ul{ list-style: none;} <br> a{ text-decoration: none;} <br> textarea{ resize: none;} <br> a,a:active,a:focus{ outline: none;} <br> a:hover{ text-decoration: underline;} <br> img{ border: none;} <br> table{ border-collapse: collapse; border-spacing: 0;} <br> .left_bar{ width: 161px;} <br> .nav{ height: 88px; padding: 35px 0 35px 40px; font: narmal 12px/22px "Microsoft Yahei";} <br> .nav li{ height: 22px; overflow: hidden; line-height: 22px; } <br> .nav li a{ color: #727171; height: 22px; overflow: hidden; cursor: pointer;} <br> .nav li a span{ display: block;} <br> .nav li a i{ display: none; font-style: normal;} <br> .nav li a:hover{ display: block; cursor: pointer; color: #093683; font-size: 14px; text-decoration: none;} <br> .nav li a:hover span{ display: none; cursor: pointer;} <br> .nav li a:hover i{ display: block; overflow: hidden;} <br> .nav li .nav_hover{ display: block; cursor: pointer; color: #093683; font-size: 14px;} <br> .nav li .nav_hover span{ display: none; cursor: pointer;} <br> .nav li .nav_hover i{ display: block; overflow : hidden;} <br> .nav li .nav_hover:hover{ display: block; cursor: pointer;} <br> .nav li .nav_hover:hover span{ display: none; cursor: pointer;} <br> .nav li .nav_hover:hover i{ display: block; overflow: hidden; font-style: normal;} <br> </style> <br> </head> <br> <body> <br> < div class="left_bar"> <br> span><i>About us</i></a></li> <br> CASE</span><i>Case Sharing</i></a></li> <br> ;SERVICE SYSTEM</span><i>Service System</i></a></li> <br> <li><a href="#" class="">< ;span>CONTACT US</span><i>Contact us</i></a></li> <br> 🎜> </body> <br> </html> <br> <br> The code is like this<br> <br> </p>
