求前端高手帮我看看图中框里的两个样式问题,代码如下。_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-21 09:12:08
Original
854 Leute haben es durchsucht

<!-- 幻灯片 --><div class="focus">	<div id="pic">		<ul>			<li><a href="http://www.17sucai.com/"><img width="620"    style="max-width:90%" alt="javascript特效图片滚动插件支持单排图片上下滚动、图片无缝滚动" src="__PUBLIC__/img/2.jpg" /></a></li>			<li><a href="http://www.17sucai.com/"><img width="620"    style="max-width:90%" alt="jquery特效制作banner图片滚动播放、按钮控制图片滚动、选项卡等基于多功能jquery slide插件" src="__PUBLIC__/img/3.jpg" /></a></li>			<li><a href="http://www.17sucai.com/"><img width="620"    style="max-width:90%" alt="jquery特效插件Validform制作一行代码搞定整站的表单验证" src="__PUBLIC__/img/4.jpg" /></a></li>			<li><a href="http://www.17sucai.com/"><img width="620"    style="max-width:90%" alt="旋转幻灯片使用jQuery和CSS3" src="__PUBLIC__/img/5.jpg" /></a></li>		</ul>	</div>	<div class="tip-bg"></div>	<div id="tip">		<ul>			<li id="smallimg_1" onclick="change(1)" class="current"></li>			<li id="smallimg_2" onclick="change(2)"></li>			<li id="smallimg_3" onclick="change(3)"></li>			<li id="smallimg_4" onclick="change(4)"></li>		</ul>	</div>	<div class="btn">		<ul>			<li class="btn-left" id="focus_btn_left" onclick="focus_prev();"></li>			<li class="btn-right" id="focus_btn_right" onclick="focus_next();"></li>		</ul>	</div></div>
Nach dem Login kopieren

@CHARSET "UTF-8";*{margin:0;padding:0;list-style-type:none;}a,img{border:none;}a{color:#1D569C;text-decoration:none;}a:hover{color:#ED3E22;text-decoration:underline;}/* focus */.focus{margin-left:30%;margin-top:3.5%;width:520px;height:300px;float:left;border:3px solid #d9d9d9;position:relative;}.focus #pic{width:520px;height:300px;overflow:hidden;}.focus #pic ul{width:4216px;height:300px;float:left;}.focus #pic li{width:520px;height:300px;float:left;}.focus #pic li img{width:520px;height:300px;float:left;}.focus .tip-bg{width:520px;height:21px;background:#000;filter:alpha(opacity=80);opacity:0.80;position:absolute;left:0;bottom:0;z-index:12;}.focus #tip{width:96px;height:14px;position:absolute;left:40%;margin:-17px 0 0;z-index:13;}.focus #tip ul li{width:14px;height:14px;float:left;display:inline;margin:0 5px;cursor:pointer;background:url(../img/focus_tip.png) no-repeat;}.focus #tip ul li.current{background:url(../img/focus_tip_current.png) no-repeat;}.focus .btn{width:42px;height:9px;position:absolute;right:0;bottom:5px;z-index:14;overflow:hidden;}.focus .btn ul{width:100%;float:left;}.focus .btn li{width:7px;height:9px;float:left;display:inline;margin:0 7px;cursor:pointer;overflow:hidden;}.focus .btn li.btn-left{background:url(../img/focus_btn_left.png) no-repeat left top;}.focus .btn li.btn-right{background:url(../img/focus_btn_right.png) no-repeat left top;}.focus .show{display:block!important;}
Nach dem Login kopieren


回复讨论(解决方案)

css代码第7行,去掉border:3px solid #d9d9d9 
另外,图片宽和高重复定义,去掉img标签内的width和height

css代码第7行,去掉border:3px solid #d9d9d9 
另外,图片宽和高重复定义,去掉img标签内的width和height

边框样式解决了,那个图片挤出来了一点怎么解决呢?

已经解决了。

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage