样式一图
样式二图
样式一：不修改这里
ul{list-style-type:none;}
ul li{float:left;display:inline;margin-right:5px;width:auto;overflow:hidden;}
ul li a{display:block;border:1px solid #CCCCCC;padding:5px 6px 5px 6px;margin:1px;}
ul li a:hover{border:2px solid #FF6701;margin:0px;}
.select{}
.select a{border:2px solid #FF6701;margin:0px;background:url(images/2010083011191628.gif) no-repeat no-repeat right bottom;}
红色
---------------------------------------------------------------------------------------------
样式二：这里跟上面重复样式，如何修改
ul,dl,dd,h1,h2,h3,h4,h5,h6,form,p,input,li{ padding:0; margin:0;}
ul,li{list-style-type:none;}
img { border:0;}
.clear{clear:both;line-height:1px;}
#con { margin:20px auto;}
#tags {width: 750px; height: 27px;position:relative;bottom:-3px;}
/* 切换风格start*/
#tags LI {background: url(images/tab/tab_bg_left_02.gif) no-repeat left bottom; float: left; margin-right: 1px; margin-right: 6px;list-style:none; height: 24px}
#tags LI A {padding:0 20px 0 20px;background: url(images/tab/tab_right_02.gif) no-repeat right bottom; float: left;color: #000;
line-height: 24px;height: 24px; text-decoration: none;}
/* 切换风格end*/
#tags LI.emptyTag {background: none transparent scroll repeat 0% 0%; width: 4px;}
#tags LI.selectTag {background-position: left top; margin-bottom: -2px; position: relative;top:-2px; height: 27px;}
#tags LI.selectTag A {padding:0 20px 0 20px;background-position: right top; font-size:14px;color: #fff;font-weight:bold; line-height: 25px; height: 27px;}
#tags LI A p{position:relative;top:2px;}
#tagContent {border-top: #fa4e86 2px solid;}/*粉色02*/
.tagContent { display: none;}
#tagContent DIV.selectTag {display: block;}
商品介绍
评价详情
成交记录
回复讨论(解决方案)
是不是点击之后出的效果，js呢？贴出来
function selectTag(showContent,selfObj){
var tag = document.getElementById("tags").getElementsByTagName("li");
var taglength = tag.length;
for(i=0; i tag[i].className = "";
}
selfObj.parentNode.className = "selectTag";
for(i=0; j=document.getElementById("tagContent"+i); i++){
j.style.display = "none";
}
document.getElementById(showContent).style.display = "block";
}
ul,dl,dd,h1,h2,h3,h4,h5,h6,form,p,input,li{ padding:0; margin:0;}
ul,li{list-style-type:none;}
img { border:0;}
.clear{clear:both;line-height:1px;}
#con { margin:20px auto;}
#tags {width: 750px; height: 27px;position:relative;bottom:-3px;}
/* 切换风格start*/
#tags LI {background: url(http://HdhCmsTestheredc测试数据/js/tab/tab_bg_left_02.gif) no-repeat left bottom; float: left; margin-right: 1px; margin-right: 6px;list-style:none; height: 24px}
#tags LI A {padding:0 20px 0 20px;background: url(http://HdhCmsTestheredc测试数据/js/tab/tab_right_02.gif) no-repeat right bottom; float: left;color: #000;
line-height: 24px;height: 24px; text-decoration: none;}
/* 切换风格end*/
#tags LI.emptyTag {background: none transparent scroll repeat 0% 0%; width: 4px;}
#tags LI.selectTag {background-position: left top; margin-bottom: -2px; position: relative;top:-2px; height: 27px;}
#tags LI.selectTag A {padding:0 20px 0 20px;background-position: right top; font-size:14px;color: #fff;font-weight:bold; line-height: 25px; height: 27px;}
#tags LI A p{position:relative;top:2px;}
#tagContent {border-top: #fa4e86 2px solid;}/*粉色02*/
.tagContent { display: none;}
#tagContent DIV.selectTag {display: block;}
window.onload=function(){
var size = new Select("size",{
Radio :true ,
OnClick:function(selected){
document.form.size.value = selected.join(",")
document.form.color.value='';
}
});
}
ul{list-style-type:none;}
ul li{float:left;display:inline;margin-right:5px;width:auto;overflow:hidden;}
ul li a{display:block;border:1px solid #CCCCCC;padding:5px 6px 5px 6px;margin:1px;}
ul li a:hover{border:2px solid #FF6701;margin:0px;}
.select{}
.select a{border:2px solid #FF6701;margin:0px;background:url(http://HdhCmsTestheredc测试数据/js/2010083011191628.gif) no-repeat no-repeat right bottom;}
$(function() {
$('#tabs').tabs();
});
S
X
XL
商品介绍
评价详情( 0 )
成交记录( 50 )
function Select(id,config){
this.config = config||{};
this.id = typeof(id)=='string'?document.getElementById(id):id;
this.items = this.id.getElementsByTagName("li");
this.selectClass = "select";
this.selected = new Array();
var _this = this;
this.selectOpt = function(value,opt){
var exist = false;
for(var i=0;i if(_this.selected[i]==value){
exist = true ;
if(opt=="remove"){ _this.selected.splice(i,1);}
break;
}
}
if(!exist && opt=="add"){_this.selected.push(value);}
};
//初始化对象
(function(_this){
//是否有默认配置的选择项
if(_this.config.Default){
var arr = _this.config.Default.split(",");
for(var i=0;i }
for(var i=0;i //将defalut中配置的项加上样式
if( _this.selected.join(",").indexOf(_this.items[i].getAttribute('dataValue'))>-1 && _this.items[i].className==""){
_this.items[i].className=_this.selectClass;
}
//如果有样式中定义了默认
if(_this.items[i].className==_this.selectClass){
_this.selectOpt(_this.items[i].getAttribute('dataValue'),"add");
}
//加点单击事件
_this.items[i].onclick=function(){
//是否为单选
var radio = _this.config.Raido?_this.config.Raido:true;
if(_this.config.Radio==null || _this.config.Radio){
if(this.className!=_this.selectClass){
var items = this.parentNode.getElementsByTagName("li");
for(var i=0;i items[i].className="";
}
_this.selected.length = 0;
_this.selected.push(this.getAttribute('dataValue'));
this.className=_this.selectClass;
}
}else{
var Max = _this.config.Max?_this.config.Max:1;
if(this.className==_this.selectClass){
this.className="";
_this.selectOpt(this.getAttribute('dataValue'),"remove");
}else{
if(_this.selected.length>=Max){
alert("最多只能选择"+Max+"项");
}else{
this.className=_this.selectClass;
_this.selectOpt(this.getAttribute('dataValue'),"add");
}
}
}
//去掉那个虚线框
this.firstChild.blur();
//调用回调函数
if(_this.config.OnClick)_this.config.OnClick.call(this,_this.selected);
return false;
}
}
})(_this);
}
楼主 说 a:hover 的效果 重叠了吗?
function selectTag(showContent,selfObj){var tag = document.getElementById("tags").getElementsByTagName("li");var taglength = tag.length;for(i=0; i ul,dl,dd,h1,h2,h3,h4,h5,h6,form,p,input,li{ padding:0; margin:0;}ul,li{list-style-type:none;}img { border:0;}.clear{clear:both;line-height:1px;}#con { margin:20px auto;}#tags {width: 750px; height: 27px;position:relative;bottom:-3px;}/* 切换风格start*/#tags LI {background: url(http://HdhCmsTestheredc测试数据/js/tab/tab_bg_left_02.gif) no-repeat left bottom; float: left; margin-right: 1px; margin-right: 6px;list-style:none; height: 24px}#tags LI A {padding:0 20px 0 20px;background: url(http://HdhCmsTestheredc测试数据/js/tab/tab_right_02.gif) no-repeat right bottom; float: left;color: #000; line-height: 24px;height: 24px; text-decoration: none;}/* 切换风格end*/#tags LI.emptyTag {background: none transparent scroll repeat 0% 0%; width: 4px;}#tags LI.selectTag {background-position: left top; margin-bottom: -2px; position: relative;top:-2px; height: 27px;}#tags LI.selectTag A {padding:0 20px 0 20px;background-position: right top; font-size:14px;color: #fff;font-weight:bold; line-height: 25px; height: 27px;}#tags LI A p{position:relative;top:2px;}#tagContent {border-top: #fa4e86 2px solid;}/*粉色02*/.tagContent { display: none;}#tagContent DIV.selectTag {display: block;} window.onload=function(){ var size = new Select("size",{ Radio :true , OnClick:function(selected){ document.form.size.value = selected.join(",") document.form.color.value='';}});} ul{list-style-type:none;}ul li{float:left;display:inline;margin-right:5px;width:auto;overflow:hidden;}ul li a{display:block;border:1px solid #CCCCCC;padding:5px 6px 5px 6px;margin:1px;}.test a:hover{border:2px solid #FF6701;margin:0px;}.select{}.select a{border:2px solid #FF6701;margin:0px;background:url(http://HdhCmsTestheredc测试数据/js/2010083011191628.gif) no-repeat no-repeat right bottom;} $(function() {$('#tabs').tabs();}); S X XL
商品介绍
评价详情( 0 )
成交记录( 50 )
001002003 function Select(id,config){ this.config = config||{}; this.id = typeof(id)=='string'?document.getElementById(id):id; this.items = this.id.getElementsByTagName("li"); this.selectClass = "select"; this.selected = new Array(); var _this = this; this.selectOpt = function(value,opt){ var exist = false; for(var i=0;i =Max){ alert("最多只能选择"+Max+"项"); }else{ this.className=_this.selectClass; _this.selectOpt(this.getAttribute('dataValue'),"add"); } } } //去掉那个虚线框 this.firstChild.blur(); //调用回调函数 if(_this.config.OnClick)_this.config.OnClick.call(this,_this.selected); return false; } } })(_this); } @calmcrime
对的。内容A的样式和内容B的样式重叠了，我想实现的是：内容A用内容A的样式，内容B用内容B的样式，互不干扰。谢谢
因为内容A的样式比较重要，所以希望大哥能帮我修改内容B的样式，不要修改A的样式，谢谢
是3楼的意思吗？
是3楼的意思吗？
大侠，我留言给你了，麻烦你看看，或者加我QQ 77644278，在QQ里截图给你看可能更清晰一些，谢谢！
@calmcrime
大侠，或者你把代码做成HTML文件，就能看到具体是什么情况了。
有什么问题 就在这儿说， 截图贴上来吧
@calmcrime
大侠，我弄个链接给你看比较直观吧
http://HdhCmsTestheredc测试数据/js/a.htm
给样式2重新指定：
border:0px;
不行吗？
查看更多关于各位大侠，以下虽然定义了两个样式，但样式二却包含了样式一了，请帮忙修改_html/css_WEB-I的详细内容...