<!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>
<title>CSS无序列实现表宽度自适应的表格_网页代码站(www.webdm.cn)</title>
<style type="text/css">
* { margin:0; padding:0; list-style:none;}
ul { border:1px solid #cfdae8; border-left:none; border-bottom:none; overflow:hidden; background:url(/images/20111223/linex.gif); zoom:1;}
li { width:20%; *width:19.9%;/*IE6&IE7的宽度有点囧*/ float:left;}
span { display:block; border-left:1px solid #cfdae8; height:24px; font-size:12px; line-height:24px; padding:0 4px;}
</style>
</head>
<body>
<ul>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
    <li><span></span></li>
</ul>
<br /><br />不管浏览器的窗口有多宽，它都会自适应宽度。
<br />
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码！</p>
</body>
</html>

CSS无序列实现表宽度自适应的表格的更多相关文章

  1. 老生长谈：css实现右侧固定宽度，左侧宽度自适应

    反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽度自适应. 这种布局比较常见,博客园很多默认主题就是这种.一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域 ...

  2. 老生长谈，温故知新：css实现右侧固定宽度，左侧宽度自适应

    反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽度自适应. 这种布局比较常见,博客园很多默认主题就是这种.一般情况下,这种布局中宽度固定的区域是侧边栏,而自适应的区域 ...

  3. [转]css实现左侧宽度自适应，右侧固定宽度

    原文地址:https://segmentfault.com/a/1190000008411418 页面布局中经常用会遇到左侧宽度自适应,右侧固定宽度,或者左侧宽度固定,右侧自适应.总之就是一边固定宽度 ...

  4. css实现右侧固定宽度，左侧宽度自适应

    https://blog.csdn.net/qq_22889599/article/details/78414040 反过来也可以:左侧宽度固定,右侧自适应.不管是左是右,反正就是一边宽度固定,一边宽 ...

  5. CSS自适应布局(包括两边宽度固定中间宽度自适应与中间宽度固定两边宽度自适应)

    1.两边宽度固定,中间宽度自适应 (1)非CSS3布局,浮动定位都可以(以下用浮动) css样式: #left { float: left;width: 200px; background: lime ...

  6. 移动端 css实现自适应正圆 ( 宽高随着手机屏幕宽度自适应 )

    序言:应朋友要求随手写了一下移动端 css实现自适应正圆 ( 宽高随着手机屏幕宽度自适应 ) ,以备后用 LESS代码: .adaptive-circle { margin: 50px auto 0; ...

  7. 记一道css面试题 : 三栏布局两边宽度固定，中间宽度自适应，并且布局随屏幕大小改变。

    前几天面试时有道css题没做出来,回来好好学习一番后把其记录下来. 题目是这样的:左中右三栏布局,左右两栏宽度固定,左右两栏的宽度为200像素,中间栏宽度自适应.当屏幕小于600px时,3栏会分别占用 ...

  8. 转：CSS布局奇淫技巧之-宽度自适应

    css这个东西,说难不难,说容易也不容易.我觉得最重要的还是经验的积累,正所谓的不积硅步,无以至千里.这一系列文章讲述几种css特殊布局的实现,也当作为自己做个备忘吧. 首先讲的是三列布局,左右两列宽 ...

  9. css实现div中图片高度自适应并与父级div宽度一致

    需求:1.父级div不设置高度 2.图片高度自适应,并且显示为正方形: 以前遇到列表中图片高度必须和父级宽度相同,并且需要为正方形的时候,最开始的方法是定死图片高度,这样会导致不同分辨率下图片会压缩, ...

随机推荐

  1. 研究SVM时安装的一些工具的方法

    本文是个人存档,不介绍研究SVM相关内容. 1.bamboo在fedora19下 哪一行编译时报错,就注释掉 php插件不用装 提示ERROR: libcrfpp.so.0: cannot open ...

  2. CSS中如何让元素隐藏

    在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击.下面一个个列出,选一个适合你的 { display: none; /* 不 ...

  3. RHCA-红帽认证架构师

    OpenStack: 向部署应用 配置域.数据源子系统.中实施应用安全 迁移应用至 介绍集群 考试代码 任选其中五门: (红帽企业虚拟化) (红帽企业部署和系统管理) (红帽企业服务器硬化) (红帽企 ...

  4. Redis学习手册——转载

    转载出处:http://www.cnblogs.com/stephen-liu74/archive/2012/04/16/2370212.html 为什么自己当初要选择Redis作为数据存储解决方案中 ...

  5. web前端之性能优化

    作为一个前端工作人员,而且只会写点HTML5和CSS3的“假”前端工程师,为了能更好地理解一下前端的花花世界,最近拜读了<高性能网站建设指南>一书,对作者提出的前端性能优化的14个规则获益 ...

  6. CSharper 学Quick-Cocos2d-X (一) 开发环境的搭建

    前言   本来想写CSharper 学Cocos2dx系列的.但是最近在了解许多跨平台游戏开发框架后 最终决定使用Quick-cocos2d-x+lua进行第一个游戏项目的开发.经过一天多的折腾 终于 ...

  7. 信鸽推送(XGPush)

    先放入两个链接: iOS信鸽接入官方文档:http://developer.qq.com/wiki/xg/iOS接入/iOS%20SDK完整接入/iOS%20SDK完整接入.html 信鸽开放平台:h ...

  8. LoadLibrary函数定位DLL顺序

    用LoadLibrary此函数来加载动态链接库到内存,Window 定位DLL的搜寻路径如下: 当前进程的可执行模块所在的目录. 当前目录. Windows 系统目录.GetSystemDirecto ...

  9. MySQL存储引擎的实际应用以及对MySQL数据库中各主要存储引擎的独特特点的描述

    MySQL存储引擎的实际应用以及对MySQL数据库中各主要存储引擎的独特特点的描述: 1.MySQL有多种存储引擎: MyISAM.InnoDB.MERGE.MEMORY(HEAP).BDB(Berk ...

  10. miniui中常用的状态显示方式

    1.查询sys_code表得到对应的状态 考生状态:<input class="mini-combobox" style="" textField=&qu ...