请选择 进入手机版 | 继续访问电脑版
收藏本站腾讯微博新浪微博
点点网模板设计大赛 phpchina

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 用悬赏 三天解决问题 解决访问速度慢 论坛支持农历生日 - 给官方提建议

论坛活动及任务 归纳网站最新活动 地图任务 邮件更新任务:保护帐号安全

积分换实物,来参加蓝色理想积分兑换吧! 联系招聘客服 蓝色理想帮你找工作! 万元奖励等你拿——点点网模板设计大赛

查看: 907|回复: 11

[求助] 这种格式怎样才能符合语义呢? [复制链接]

lalasxc 楼主
帖子
298
体力
887
威望
3
发表于 2008-4-15 17:08:24 |显示全部楼层
http://www.tjdadi.com.cn/oo/index.html
把偶偶视频网站截图下来做的,但是这一部分不知怎么做好,如下图,要怎样才能方便还符合语义呢:

是UL好,还是DL好呢?请大家指教。

附件: 你需要登录才可以下载或查看附件。没有帐号?注册
西部数码顶级域名注册商39元抢注!
mental 

小鱼的理想

银牌会员 手机认证 

帖子
568
体力
2304
威望
1
居住地
山东省 济宁市
发表于 2008-4-15 17:11:52 |显示全部楼层
有排名的当然是用UL了
租服务器,上51IDC | [长沙]招聘:PHP经理10K/WEB前端6K/PHP开发6K

使用道具 举报

hauy 
帖子
126
体力
289
威望
0
发表于 2008-4-15 17:13:59 |显示全部楼层
这个部分,用ol就可以了。
不过只用ol的话,数字部分的样式会比较难写。

简单一点的话,ol里嵌套个其他标签。
用dl或者加个span我觉得问题都不大,只是不太符合语义。

[ 本帖最后由 hauy 于 2008-4-15 17:15 编辑 ]
噢噢~~~~

使用道具 举报

帖子
322
体力
5032
威望
0
居住地
广东省 深圳市
发表于 2008-4-15 17:14:30 |显示全部楼层

 提示:您可以先修改部分代码再运行


[ 本帖最后由 hejie06 于 2008-4-15 17:15 编辑 ]
@seadesign

使用道具 举报

lalasxc 楼主
帖子
298
体力
887
威望
3
发表于 2008-4-15 17:19:10 |显示全部楼层
布局倒不是问题,关键是样式表去掉后,用户还能看明白,就是名次要和视频名称看起来有对应关系,像表格一样

使用道具 举报

lalasxc 楼主
帖子
298
体力
887
威望
3
发表于 2008-4-15 17:21:22 |显示全部楼层
谢谢各位,个觉得4#的方法合理些

使用道具 举报

帖子
322
体力
5032
威望
0
居住地
广东省 深圳市
发表于 2008-4-15 17:23:44 |显示全部楼层
这种情况,应该有所取舍。
看你重点是在列表还是有序?
列表的话,用ol,ul,dl都没多大问题,要是在乎有序列表的话,还是用ol吧。
当然,处理起来,个人认为dl占优势。
@seadesign

使用道具 举报

10dw 

小盆友

高级会员

帖子
474
体力
1851
威望
0
居住地
美洲 美国
发表于 2008-4-15 18:19:04 |显示全部楼层
有点恶心 凑合看吧

 提示:您可以先修改部分代码再运行


  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>none</title>
  6. <style type="text/css" media="screen">
  7. * {margin:0;padding:0;}
  8. body {font-family:Verdana, Arial, Helvetica, sans-serif;font-size:small;}
  9. ul {list-style-type:none;}
  10. #child_board_chinese_video {position:relative;width:300px;height:300px;background-color:#EFEFEF;}
  11. img.child_board_vision {height:30px;position:absolute;left:0;top:0;}
  12. h3.child_board_head_title {text-align:center;line-height:30px;position:relative;color:#FF0000;font-size:18px;}
  13. span.more {position:absolute;right:0;top:0;}
  14. span>a {text-decoration:none;color:#FF0033;font-weight:normal;font-size:12px;}
  15. table.child_board_body {width:300px;border-collapse:collapse;}
  16. .child_board_body_sort {width:40px;height:20px;}
  17. .child_board_body_name {height:20px;width:auto;border-left:1px solid #999999;}
  18. th {background-color:#FFCC66;}
  19. tr.child_board_body_piece_odd>td {background-color:#FFFFCC;}
  20. table>tbody>tr {text-align:left;}
  21. table>tbody>tr>td.child_board_body_sort {text-align:center;}
  22. </style>
  23. <script type="text/javascript">
  24. </script>
  25. </head>
  26. <body>
  27. <div id="child_board_chinese_video">
  28. <img class="child_board_vision" src="http://www.baidu.com/img/logo.gif" />
  29. <div class="child_board_head">
  30. <h3 class="child_board_head_title">十一期<span class="more"><a href="javascript:void(0)">more...</a></span></h3>
  31. </div>
  32. <table class="child_board_body">
  33. <thead>
  34. <tr>
  35. <th class="child_board_body_sort">排名</th><th class="child_board_body_name">名称</th>
  36. </tr>
  37. </thead>
  38. <tbody>
  39. <tr class="child_board_body_piece_odd">
  40. <td class="child_board_body_sort">1</td><td class="child_board_body_name">这一部分不知怎么做好</td>
  41. </tr>
  42. <tr>
  43. <td class="child_board_body_sort">2</td><td class="child_board_body_name">是UL好,还是DL好呢?</td>
  44. </tr>
  45. <tr class="child_board_body_piece_odd">
  46. <td class="child_board_body_sort">3</td><td class="child_board_body_name">要怎样才能方便还符合语义</td>
  47. </tr>
  48. </tbody>
  49. </table>
  50. </div>
  51. </body>
  52. </html>
复制代码

使用道具 举报

shulin 

漂亮的疯子

初级会员

帖子
100
体力
233
威望
1
发表于 2008-4-16 10:26:33 |显示全部楼层
用table最合理!!
我很善狼!

使用道具 举报

lalasxc 楼主
帖子
298
体力
887
威望
3
发表于 2008-4-16 10:29:47 |显示全部楼层
用table最合理!!
严重同意·!!!!

使用道具 举报

程让

钻石会员 手机认证 

帖子
1668
体力
7009
威望
1
发表于 2008-4-16 10:38:40 |显示全部楼层
虽然看起来像是个OL,但他本质是列数据,表格应该最好

使用道具 举报

czcz 
帖子
25
体力
108
威望
0
发表于 2008-4-16 10:51:32 |显示全部楼层
如果您认为它是数据,那么用table就好,如果您比较注重它的有序性,那么用ol吧。

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

Archiver|手机版|安久科技提供CDN|blueidea.com ( 京ICP备05002321号 )  

GMT+8, 2012-2-13 12:49 , Processed in 0.101270 second(s), 10 queries , Gzip On, Memcache On.

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部