`
ghyghoo8
  • 浏览: 192810 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

转:用div css li 来做表格,超过自动换行。

CSS 
阅读更多

用div css li 来做表格,超过自动换行。做图片系统时必用

Submitted by 灰鼠 on 2008, October 30, 9:45 PM. 收藏

<style type="text/css">
<!--
#box {width:auto;height:auto;}
#box ul {margin:0px;padding:0px;}
#box li {margin:2px;padding:5px;float:left;width:110px;height:110px;border:1px solid red;}
-->
</style>
<div id="box">
    <ul>
        <li>内容</li>
        <li>缩小窗口看看</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
        <li>内容</li>
    </ul>
<div>
分享到:
评论

相关推荐

    DIV_CSS测试题

    4. **div的边距设置**:在CSS中,设置子`div`与父`div`的左边距应使用`margin-left`,但题目中的写法是错误的,正确的应该是`margin-left: 5px;`。 5. **IE6的div大小问题**:在IE6下,设置一个10px * 10px大小的`...

    随手记的div+css的小抄代码

    - 使用 `display:inline` 和 `float` 来处理IE6浏览器的双倍边距问题,同时避免使用 `border-collapse` 属性来防止表格边框重叠。 #### 二、HTML结构元素使用详解 在HTML中,不同的标签有着不同的用途,下面将详细...

    css-dictionary(CSS常用英语词汇详解)

    虽然不是CSS专用词汇,但在JavaScript等编程语言中使用广泛。 - **Fixed**: 固定定位。CSS中的`position:fixed`属性用于固定元素在视口中的位置,即使页面滚动也不会移动。 - **Four**: 四个。数量词,可用于描述CSS...

    零基础HTML+CSS+DIV笔记分享

    例如,使用`&lt;header&gt;`、`&lt;nav&gt;`、`&lt;article&gt;`等标签代替泛用的`&lt;div&gt;`标签,以增强页面的可访问性和搜索引擎优化。 #### 常用HTML标签 - **标题标签**:用于定义不同级别的标题,从`&lt;h1&gt;`到`&lt;h6&gt;`,其中`&lt;h1&gt;`级别...

    div+css布局中常用方法汇总.docx

    【div+css布局中常用方法】在网页设计中,Div+CSS布局是现代网页开发的基础,它通过HTML的div元素和CSS样式来控制页面布局,提供了更灵活、可维护性更强的设计方式。以下是一些在div+css布局中常用的技术和方法: 1...

    CSS的水平导航条.docx

    另一种方法是使用 `&lt;ul&gt;` 和 `&lt;li&gt;` 标签,把链接作为无序列表来标示。这似乎不符合直观感受,因为我们习惯于把无序列表作为竖着推起来的列表项目,每个前面都放着一个 Bullet。但是,作为独立列表项目集合的列表...

    DIV+CSS网页布局基础-常用HTML标签介绍.rar

    5. **表格标签**:`&lt;table&gt;`,`&lt;tr&gt;`,`&lt;th&gt;`,`&lt;td&gt;`用于创建表格,`&lt;table&gt;`是表格的容器,`&lt;tr&gt;`代表表格行,`&lt;th&gt;`是表头单元格,`&lt;td&gt;`是普通数据单元格。 6. **区块元素与内联元素**:`&lt;div&gt;`是块级元素,它...

    H5+CSS3.zip

    使用标签添加图片,使用标签添加链接,使用table添加表格,使用thead、tbody、tfood定义表格; 表单标签:使用创建表单,文本输入框,密码输入框,数字输入框,网址输入框,邮箱输入框,创建文本域,单选框,复选框...

    CSS默写标准文档

    - `&lt;div&gt;`、`&lt;ul&gt;`、`&lt;li&gt;`、`&lt;hr&gt;`和`&lt;dl&gt;`等标签的使用,以及`&lt;ul&gt;`的`list-style`、`&lt;li&gt;`的背景图像等。 ### 7. CSS技巧 - **table边框合并**: `border-collapse: collapse;`使得表格边框合并。 - **取消a标签...

    HTMLl5+CSS总结笔记.docx

    - **`&lt;span&gt;`**:与`&lt;div&gt;`类似,但不会自动换行,常用于对行内元素应用样式。 - **文本格式化标签**: - **加粗标签**:`&lt;strong&gt;`或`&lt;b&gt;`。 - **斜体标签**:`&lt;em&gt;`或`&lt;i&gt;`。 - **删除线标签**:`&lt;del&gt;`。 -...

    HTML5 CSS3.0

    - 使用`&lt;table&gt;`、`&lt;tr&gt;`、`&lt;td&gt;`、`&lt;th&gt;`等标签创建表格。 - `&lt;caption&gt;`:为表格提供标题。 #### 2.4 列表、块、布局 - **列表**: - `&lt;ul&gt;`:无序列表。 - `&lt;ol&gt;`:有序列表。 - `&lt;li&gt;`:列表项。 - **块级...

    JavaScript中的style.display属性操作

    1. `block`:这是块级元素的默认值,如`&lt;div&gt;`、`&lt;p&gt;`等,它会在其前后换行。 2. `none`:隐藏元素,不仅不显示,而且不占用任何空间,与`visibility:hidden`不同,后者只是不可见但仍然占据空间。 3. `inline`:这...

    跟我学HTML+CSS答案

    &lt;div id="section1"&gt;这里是页面顶部&lt;/div&gt; ``` ### 第7章:表格布局与单元格属性 #### 单元格属性 - `colspan`: 设置单元格跨多列。 - `rowspan`: 设置单元格跨多行。 #### 示例代码 ```html 横跨两列 ...

    HTML_CSS学习笔记.docx

    - 使用预处理器如 SASS 或 LESS 编写更高效、模块化的 CSS。 - 利用媒体查询(media queries)实现响应式设计。 以上就是HTML和CSS的基础知识概览,它们共同构成了网页设计的基础框架,帮助开发者构建美观、功能...

    45道CSS基础面试题(附答案).pdf

    在深入探讨45道CSS基础面试题的内容之前,我们首先要了解CSS(层叠样式表)是什么。CSS是用来描述HTML或XML(包括各种XML方言,如SVG或XHTML)文档的样式的语言。它通过控制网页的布局、字体、颜色、背景和其他装饰...

    HTML CSS笔记(含HTML5 CSS3 sublime快捷键整理).docx

    - **字体样式** (`&lt;font&gt;`): 已废弃,应使用CSS来替代。 - **文本修饰**: 使用 `&lt;em&gt;`、`&lt;strong&gt;` 等标签进行文本修饰。 - **换行**: ` ` 在文本中插入换行符。 - **水平线**: `&lt;hr&gt;` 插入一条水平分隔线。 ...

    HTML之CSS 布局 - display 属性

    - **块级元素**(Block Elements):如`&lt;div&gt;`、`&lt;h1&gt;`至`&lt;h6&gt;`、`&lt;p&gt;`等,它们会自动换行显示,占据一整行宽度,可以设置宽高。它们之间的默认间距是通过外边距(margin)和内边距(padding)来调整的。 - **内联...

Global site tag (gtag.js) - Google Analytics