首页 >web前端 >html教程 >CSS求救,SOS_html/css_WEB-ITnose

CSS求救,SOS_html/css_WEB-ITnose

WBOY
WBOY原创
2016-06-21 09:12:57946浏览

<!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>    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />    <title></title>    <meta content="test" name="keywords" />    <meta content="test" name="description" />    <link href="image/favicon.ico" type="image/x-icon" rel="icon" />    <link href="image/favicon.ico" type="image/x-icon" rel="shortcut icon" />    <link type="text/css" rel="stylesheet" href="css/style.css" />    <link type="text/css" rel="stylesheet" href="css/upDateStyle.css" />    <script type="text/javascript">        window.top["BNPage"] = 0;    </script>    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>    <script type="text/javascript" src="js/offlights.js"></script>    <script type="text/javascript" src="js/ckplayer.js" charset="utf-8"></script>    <script type="text/javascript" src="js/md5.js"></script>    <script type="text/javascript" src="js/style.js"></script>    <script type="text/javascript" src="js/updateStyle.js"></script>    <script type="text/javascript" src="js/map.js"></script>    <style type="text/css">        body        {            background-image: url(image/bg.jpg);            background-repeat: repeat;        }    </style></head><body>    <div id="BNreturnTopDiv">    </div>    <div class="fwtop">        <div class="fwtop_cont">            <div class="fwtop_logo">                <div class="top_logo" id="top_logo">                    <a href="index.html">                        <img src="image/logo.png" width="170"    style="max-width:90%" alt="网站Logo" title="test" /></a>                </div>            </div>            <div class="fwtop_info">                <div class="topLanguage" id="topLanguage">                    <div class="language">                        <div id="languageContent">                            选择语言:</div>                        <div class="languageSelect" onmouseover="displayLanguage($(this))" onmouseout="hideLanguage(event,$(this))"                            id="language">                            <span class="select_languageInfo" id="select_languageInfo"><a href="javascript:void(0)"                                rel="1">简体中文</a></span> <span class="select_language" id="select_language">                                    <ul>                                        <li><a href="javascript:void(0)" rel="1">简体中文</a></li>                                    </ul>                                </span>                        </div>                    </div>                    <script type="text/javascript">                        siteLanguage()                    </script>                </div>                <div class="topSearch clear" id="topSearch">                    <div class="search">                        <input type="text" id="siteSearchContent" value="请输入关键字..." class="enter">                        <div class="select" onmouseover="displaySiteSearch($(this))" onmouseout="hideSiteSearch(event,$(this))"                            id="search">                            <span class="select_info" id="siteSelect_info"><a href="javascript:void(0)" rel="新闻">                                新闻</a></span> <span class="select_search" id="select_siteSearch">                                    <ul>                                        <li><a href="javascript:void(0)" rel="新闻">新闻</a></li>                                        <li><a href="javascript:void(0)" rel="产品">产品</a></li>                                        <li><a href="javascript:void(0)" rel="下载">下载</a></li>                                        <li><a href="javascript:void(0)" rel="招聘">招聘</a></li>                                    </ul>                                </span>                        </div>                        <input id="siteSearchSubmit" type="button" class="btn" />                    </div>                    <script type="text/javascript">                        siteSearch()                    </script>                    <script type="text/javascript">                        $("#siteSearchContent").focus(function () {                            if (this.value == "请输入关键字...") {                                this.value = ""                            }                        });                        $("#siteSearchContent").blur(function () {                            if (this.value == "") {                                this.value = "请输入关键字...";                            }                        });                    </script>                </div>            </div>            <div class="clear">            </div>            <div class="fwtop_mainNav">

上面头部部分html代码,后面部分未贴上来,比较多,下面贴一部分关键css
@charset "utf-8";/*CSSDocument*//*模板页面样式*/* {	margin:0;	padding:0;}body {	margin:0;	padding:0;}body {	font-size: 12px;	margin:0 auto;	padding:0;}ol, ul {	list-style: none outside none;	padding:0;	margin:0;}img {	border:none;}/*前台a标签样式*/a:link, a:visited {	color:#333333;	text-decoration: none;	outline:none;}a:hover, a:active {	color:#a40000;	text-decoration: none;	outline:none;}/*后台a标签样式*/.edit_page a:link, .edit_page a:visited {	color:#333333;	text-decoration: none;	outline:none;}.edit_page a:hover, .edit_page a:active {	color:#a40000;	text-decoration: none;	outline:none;}.clear {	clear:both;}.fwtop {	width:1000px;	overflow:hidden;	margin:0 auto;}.fwtop_cont{	margin:0 auto;}.fwtop_logo {	width:180px;	padding-top:10px;	float:left;	height:60px;	overflow:hidden;}/*头部信息*/.fwtop_info {	float:right;	position:relative;	z-index:600;}.topInfo {	float:left;	padding:20px 0;}.topLanguage {	float:right;	margin-left:15px;	padding:10px 0;}#languageContent {	/*width:60px;*/	float:left;	margin-top:4px;}.languageSelect {	/*width:75px;*/	float:right;}.languageSelect {	background: none repeat scroll 0 0 #FFFFFF;	border:solid 1px #CCCCCC;	cursor: pointer;	float: left;	line-height: 20px;}.select_languageInfo {	background: url(../image/search_down.gif) no-repeat scroll 100% 50% transparent;	padding: 0 20px 0 5px;}.select_language {	background-color: #FFFFFF;	border-left:solid 1px #CCCCCC;	border-right:solid 1px #CCCCCC;	border-bottom:solid 1px #CCCCCC;	font-size: 12px;	padding: 5px 0;	position: absolute;	width: 72px;	z-index: 503;	display:none;}.select_language ul li a {	padding:2px 5px;	display:block;	width:65px;}.select_language ul li a:hover {	background:#e8e8e8;}.topSearch {	float:right;	right:0;	top:40px;}.fwtop_banner{	mardin:10px 0;}.fwmain {	width:1000px;	margin:0 auto;	/*background:url(../image/fwmain_bg.jpg) repeat-y;*/	padding:0 20px;}.fwmain_left {	width:210px;	float:left;}.fwmain_left .label_head {/*	background:url(../image/left_title.jpg) no-repeat;*/	overflow: hidden;/*cursor:move;*/}.fwmain_left .label_title {	font-size:14px;	float:left;	padding-left:10px;	color:#444;}.fwmain_right{	width:730px;	float:right;}.fwmain_right1 {	width:450px;	float:left;}.fwmain_right2 {	width:260px;	float:right;}.fwmain_right3 {}

有问题部分代码,可以在上面代码中看比较完整的代码,这里提出来方面知道我的问题在哪儿
<div class="topSearch clear" id="topSearch">                    <div class="search">                        <input type="text" id="siteSearchContent" value="请输入关键字..." class="enter">                        <div class="select" onmouseover="displaySiteSearch($(this))" onmouseout="hideSiteSearch(event,$(this))"                            id="search">                            <span class="select_info" id="siteSelect_info"><a href="javascript:void(0)" rel="新闻">                                新闻</a></span> <span class="select_search" id="select_siteSearch">                                    <ul>                                        <li><a href="javascript:void(0)" rel="新闻">新闻</a></li>                                        <li><a href="javascript:void(0)" rel="产品">产品</a></li>                                        <li><a href="javascript:void(0)" rel="下载">下载</a></li>                                        <li><a href="javascript:void(0)" rel="招聘">招聘</a></li>                                    </ul>                                </span>                        </div>                        <input id="siteSearchSubmit" type="button" class="btn" />                    </div>

有问题的截图如下:


正常如图:


在360和谷歌中,没有问题,在IE和火狐中,就没有引用到样式,所有初始样式都在一个css中,整体上无大问题,就只有右上角的搜索样式有问题,其他地方也有一个类似的问题,不知道什么原因,网上找的资料也已经尝试过,没有效果, 如果样式放在行中是有效果的
求助,SOS


回复讨论(解决方案)

没人帮助么

又加啦30分,有木有人知道的回答下呢

我去,还打马。。。。。

你把通用符*{padding:0;margin:0;}去掉;换成你用到的标签名字试试……

先把所有js干掉,把要用js加?的部分直接?在html里面,然后再看?式?不?有??
如果有,那?很可能是哪?js里有什麽操作把?式重?,或改?了?面html??,?致?式失效

如果?有,那?是?式的??。
你??在行?有效,?就表明是css?先?起了用作,行??式>css文件?的?式
一?可能是?式在其它地方被重?了;
另外一?可能就是css hack引起的,特?是在IE??器中,css hack可能?致上下文的?式失效;
?有一?可能是??器本身插件?致的?式??(??可能很小了,但?有)

以上就是一?debug的思路,LZ?下心?再好好查查

先把所有js干掉,把要用js加?的部分直接?在html里面,然后再看?式?不?有??
如果有,那?很可能是哪?js里有什麽操作把?式重?,或改?了?面html??,?致?式失效

如果?有,那?是?式的??。
你??在行?有效,?就表明是css?先?起了用作,行??式>css文件?的?式
一?可能是?式在其它地方被重?了;
另外一?可能就是css hack引起的,特?是在IE??器中,css hack可能?致上下文的?式失效;
?有一?可能是??器本身插件?致的?式??(??可能很小了,但?有)

以上就是一?debug的思路,LZ?下心?再好好查查


1、我将样式和代码单独拷贝出来,没有问题
2、我将样式换一个样式表存放,也没有问题
3、原始样式在IE于火狐不行,在谷歌和360可以
4、在IE和火狐中,查看样式,未看到,所以应该是未引用到,但是同一个样式表中的其他样式又是有效的,很奇怪
以上是我自己的一个测试效果,你看看我还有什么没有想到的,帮忙回下,因为我css不是很强,就只能通过测试来定位,麻烦你了
声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn