高分求助,请高手进来帮个忙。在线等........... 本帖最后由 honglei8485 于 2011-03-30 22:27:04 编辑 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 没时间帮你研究,找一个现成的代码给你,稍加改造即可:1、每一行都用不同的class(例如class="a1 red"),区分1.2.3.4序号,序号用背景图。2、标题部位由颜色缓存“每日推荐”背景图3、每行用下边框border-bottom:1px solid #ddd。<!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=gb2312" /><title>DivCSS布局实例:很实用的图文混排CSS列表 - 富有语义</title><style type="text/css">* { margin:0; padding:0; font-size:13px; color:#000; list-style:none;}a { color:#03c; text-decoration:none;}a:hover { text-decoration:underline;}.box_1{ width:418px; margin:30px auto; border:1px solid #999;}.list_title { width:418px; height:32px; border-bottom:1px solid #999; background:#f2f9fd; overflow:hidden;}.list_title h2 { float:left; width:160px; line-height:32px; text-indent:15px;}.list_title h2 a { color:#c00;}.list_title h2 a:hover { color:#03c;}.list_title ul { float:right; width:230px;}.list_title ul li { float:left; line-height:32px; padding:0 5px;}.list_title ul li a { font-size:12px; color:#333;}.list_unit { float:left; width:388px; margin-left:15px; padding:15px 0 8px 0; border-bottom:1px dotted #9AC4E9;}.list_unit { display:inline;}.list_unit p { float:left; width:164px;}.list_unit p a { display:block; border:1px solid #03c;}.list_unit p a:hover { border:1px dashed #00f;}.list_unit p a img { width:160px; height:120px; margin:1px; border:0;}.list_unit span { display:block;}.list_unit span a { display:block; width:164px; height:22px; border:0; line-height:22px; text-align:center;}.list_unit span a:hover { border:0; color:#c00;}.list_unit ul { float:right; width:216px; margin-top:-5px;}.list_unit ul li { float:left; width:216px; line-height:22px; color:#039; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}.list_news{ float:left; width:388px; margin-left:15px; padding:15px 0 8px 0; border-bottom:1px dotted #9AC4E9;}.list_news ul{ float:right; width:388px; /*直接使用父边距*/ margin-top:-5px;}.list_news ul li{ float:left; overflow:hidden; line-height:22px; width:378px;/*388减去左内空白10px;*/ list-style-type:circle; padding-left:15px; background:url('ico.gif') no-repeat 0 6px; /*背景图定位left:0 top:6px*/ }.list_news ul li a{ float:left; width:318px;/*a318+span60=378px;*/ white-space:nowrap; text-overflow:ellipsis; overflow:hidden; /*不断行,超出隐藏,超出省略*/ }.list_news ul li span{ float:right; width:60px;}#l_templates { border-width:0;}.clear { clear:both;}</style></head><body><div class="box_1" id="store_notice"> <div class="list_title"> <h2><a href="http://www.52css.com/" title="我爱CSS">我爱CSS 52CSS.com</a></h2> <ul> <li><a href="http://www.52css.com/css_websites_showcase/" title="CSS酷站欣赏">CSS酷站欣赏</a></li> <li><a href="http://www.52css.com/default.asp" title="DivCSS教程">DivCSS教程</a></li> <li><a href="http://www.52css.com/css_template/" title="CSS模板下载">CSS模板下载</a></li> </ul> </div> <div class="list_unit" id="l_showcase"> <p> <a href="http://www.52css.com/css_websites_showcase/"><img src="1.jpg" alt="CSS酷站欣赏" /></a> <span><a href="http://www.52css.com/css_websites_showcase/">CSS酷站欣赏</a></span> </p> <ul> <li>·<a href="http://www.52css.com/article.asp?id=668">CSS控制Table单元格强制换行与强制不换行 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=667">DivCSS实例:CSS菜单Flash效果 用图片模拟实现 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=666">DivCSS布局实例 用dl dt dd来制作列表 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=660">符合web标准的嵌入Flash的方法-JS调用 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=656">CSS经验:如何管理好样式CSS? </a></li> <li>·<a href="http://www.52css.com/article.asp?id=655">DIV CSS实例:橙蓝互换的CSS翻页效果 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=650">div css表单布局技巧及CSS Form表单设计技巧 </a></li> </ul> </div> <div class="clear"></div></div><div class="box_1" id="newnewss"> <div class="list_title"> <h2><a href="http://www.52css.com/" title="我爱CSS">我爱CSS 52CSS.com</a></h2> <ul> <li><a href="http://www.52css.com/css_websites_showcase/" title="CSS酷站欣赏">CSS酷站欣赏</a></li> <li><a href="http://www.52css.com/default.asp" title="DivCSS教程">DivCSS教程</a></li> <li><a href="http://www.52css.com/css_template/" title="CSS模板下载">CSS模板下载</a></li> </ul> </div> <div class="list_unit" id="l_article"> <ul> <li>·<a href="http://www.52css.com/article.asp?id=668">CSS控制Table单元格强制换行与强制不换行 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=667">DivCSS实例:CSS菜单Flash效果 用图片模拟实现 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=666">DivCSS布局实例 用dl dt dd来制作列表 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=660">符合web标准的嵌入Flash的方法-JS调用 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=656">CSS经验:如何管理好样式CSS? </a></li> <li>·<a href="http://www.52css.com/article.asp?id=655">DIV CSS实例:橙蓝互换的CSS翻页效果 </a></li> <li>·<a href="http://www.52css.com/article.asp?id=650">div css表单布局技巧及CSS Form表单设计技巧 </a></li> </ul> </div> <div class="list_news" id="l_article"> <ul> <li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=668">CSS控制Table单元格强制换行与强制不换行 </a></li> <li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=667">DivCSS实例:CSS菜单Flash效果 用图片模拟实现 用图片模拟实现</a></li> <li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=666">DivCSS布局实例 用dl dt dd来制作列表 </a></li> <li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=660">符合web标准的嵌入Flash的方法-JS调用 </a></li> <li><a href="http://www.52css.com/article.asp?id=656">CSS经验:如何管理好样式CSS? </a><span>09/12/12</span></li> <li><a href="http://www.52css.com/article.asp?id=655">DIV CSS实例:橙蓝互换的CSS翻页效果 </a><span>09/12/12</span></li> <li><a href="http://www.52css.com/article.asp?id=650">div css表单布局技巧及CSS Form表单设计技巧 </a><span>09/12/12</span></li> </ul> </div></div></body></html> 分数给的太少了吧,真的做出来估计也有2个小时才能全部弄好呢?其实css+div不是很难?为什么不自己试着写呢?肯定自己能写出来,所以学起来并不困难! 到 web大板去问,牛人很多 关于phpwind幻灯片不能显示的问题 大家觉得哪个开源的后台管理好用 谁能给个phpchina的邀请码 php如何去这样的数据? iframe 哈哈oschina自己搞代码托管了,呵呵 返回字符串截取循环 求用php获取qq好友列表的方法 phpstorm自动提示,能不能像sublime一样方便 php中有木有办法可以获取js的值 各位大侠 帮帮我吧~~ 请问如何用php 生成.asmx文件 ? 在线等啊~~~~~ dede cms 中怎样调用sql语句啊
1、每一行都用不同的class(例如class="a1 red"),区分1.2.3.4序号,序号用背景图。
2、标题部位由颜色缓存“每日推荐”背景图
3、每行用下边框border-bottom:1px solid #ddd。<!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=gb2312" />
<title>DivCSS布局实例:很实用的图文混排CSS列表 - 富有语义</title>
<style type="text/css">
* { margin:0; padding:0; font-size:13px; color:#000; list-style:none;}
a { color:#03c; text-decoration:none;}
a:hover { text-decoration:underline;}
.box_1{ width:418px; margin:30px auto; border:1px solid #999;}.list_title { width:418px; height:32px; border-bottom:1px solid #999; background:#f2f9fd; overflow:hidden;}
.list_title h2 { float:left; width:160px; line-height:32px; text-indent:15px;}
.list_title h2 a { color:#c00;}
.list_title h2 a:hover { color:#03c;}
.list_title ul { float:right; width:230px;}
.list_title ul li { float:left; line-height:32px; padding:0 5px;}
.list_title ul li a { font-size:12px; color:#333;}.list_unit { float:left; width:388px; margin-left:15px; padding:15px 0 8px 0; border-bottom:1px dotted #9AC4E9;}
.list_unit { display:inline;}
.list_unit p { float:left; width:164px;}
.list_unit p a { display:block; border:1px solid #03c;}
.list_unit p a:hover { border:1px dashed #00f;}
.list_unit p a img { width:160px; height:120px; margin:1px; border:0;}
.list_unit span { display:block;}
.list_unit span a { display:block; width:164px; height:22px; border:0; line-height:22px; text-align:center;}
.list_unit span a:hover { border:0; color:#c00;}
.list_unit ul { float:right; width:216px; margin-top:-5px;}
.list_unit ul li { float:left; width:216px; line-height:22px; color:#039; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.list_news{ float:left; width:388px; margin-left:15px; padding:15px 0 8px 0; border-bottom:1px dotted #9AC4E9;}
.list_news ul{
float:right;
width:388px; /*直接使用父边距*/
margin-top:-5px;}
.list_news ul li{
float:left; overflow:hidden; line-height:22px;
width:378px;/*388减去左内空白10px;*/
list-style-type:circle;
padding-left:15px;
background:url('ico.gif') no-repeat 0 6px; /*背景图定位left:0 top:6px*/
}
.list_news ul li a{
float:left;
width:318px;/*a318+span60=378px;*/
white-space:nowrap; text-overflow:ellipsis; overflow:hidden; /*不断行,超出隐藏,超出省略*/
}
.list_news ul li span{ float:right; width:60px;}
#l_templates { border-width:0;}
.clear { clear:both;}
</style>
</head><body>
<div class="box_1" id="store_notice">
<div class="list_title">
<h2><a href="http://www.52css.com/" title="我爱CSS">我爱CSS 52CSS.com</a></h2>
<ul>
<li><a href="http://www.52css.com/css_websites_showcase/" title="CSS酷站欣赏">CSS酷站欣赏</a></li>
<li><a href="http://www.52css.com/default.asp" title="DivCSS教程">DivCSS教程</a></li>
<li><a href="http://www.52css.com/css_template/" title="CSS模板下载">CSS模板下载</a></li>
</ul>
</div>
<div class="list_unit" id="l_showcase">
<p>
<a href="http://www.52css.com/css_websites_showcase/"><img src="1.jpg" alt="CSS酷站欣赏" /></a>
<span><a href="http://www.52css.com/css_websites_showcase/">CSS酷站欣赏</a></span>
</p>
<ul>
<li>·<a href="http://www.52css.com/article.asp?id=668">CSS控制Table单元格强制换行与强制不换行 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=667">DivCSS实例:CSS菜单Flash效果 用图片模拟实现 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=666">DivCSS布局实例 用dl dt dd来制作列表 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=660">符合web标准的嵌入Flash的方法-JS调用 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=656">CSS经验:如何管理好样式CSS? </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=655">DIV CSS实例:橙蓝互换的CSS翻页效果 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=650">div css表单布局技巧及CSS Form表单设计技巧 </a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="box_1" id="newnewss">
<div class="list_title">
<h2><a href="http://www.52css.com/" title="我爱CSS">我爱CSS 52CSS.com</a></h2>
<ul>
<li><a href="http://www.52css.com/css_websites_showcase/" title="CSS酷站欣赏">CSS酷站欣赏</a></li>
<li><a href="http://www.52css.com/default.asp" title="DivCSS教程">DivCSS教程</a></li>
<li><a href="http://www.52css.com/css_template/" title="CSS模板下载">CSS模板下载</a></li>
</ul>
</div>
<div class="list_unit" id="l_article">
<ul>
<li>·<a href="http://www.52css.com/article.asp?id=668">CSS控制Table单元格强制换行与强制不换行 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=667">DivCSS实例:CSS菜单Flash效果 用图片模拟实现 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=666">DivCSS布局实例 用dl dt dd来制作列表 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=660">符合web标准的嵌入Flash的方法-JS调用 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=656">CSS经验:如何管理好样式CSS? </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=655">DIV CSS实例:橙蓝互换的CSS翻页效果 </a></li>
<li>·<a href="http://www.52css.com/article.asp?id=650">div css表单布局技巧及CSS Form表单设计技巧 </a></li>
</ul>
</div>
<div class="list_news" id="l_article">
<ul>
<li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=668">CSS控制Table单元格强制换行与强制不换行 </a></li>
<li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=667">DivCSS实例:CSS菜单Flash效果 用图片模拟实现 用图片模拟实现</a></li>
<li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=666">DivCSS布局实例 用dl dt dd来制作列表 </a></li>
<li><span>09/12/12</span><a href="http://www.52css.com/article.asp?id=660">符合web标准的嵌入Flash的方法-JS调用 </a></li>
<li><a href="http://www.52css.com/article.asp?id=656">CSS经验:如何管理好样式CSS? </a><span>09/12/12</span></li>
<li><a href="http://www.52css.com/article.asp?id=655">DIV CSS实例:橙蓝互换的CSS翻页效果 </a><span>09/12/12</span></li>
<li><a href="http://www.52css.com/article.asp?id=650">div css表单布局技巧及CSS Form表单设计技巧 </a><span>09/12/12</span></li>
</ul>
</div>
</div></body>
</html>