<html >
<head>
<title>模似表格</title>
<meta />
<style>
html { font-size:12px; }
body { margin:50px; }
.clearfix:after { content:'\0020'; display:block; height:0; clear:both; }
.clearfix { *zoom:1;}
ul,li{border:solid 1px #3CF; margin:0; padding:0;}
ul{ border-bottom:none; border-right:none;}
ul{ width:404px;}
li{ width:100px; height:26px;line-height:25px; border-top:none; border-left:none; float:left; display:inline;overflow-y:auto;word-wrap: break-word; word-break: break-all;text-align: center; }
/*div{border:1px #686868 solid; margin-top:50%}*/
</style>
</head>
<body>
<ul class="clearfix">
<li>问题已经解决。说来可笑。自己在DW里手动敲代码。
发现一个属性里有nowrap，这个nowrap不是word-braek的吗？难道它能让不换行？
抱着试试的心理我把它完整敲上
white-space: nowrap;
DW测试没有出现下划虚线，意思是浏览器支持方面没有问题。
保存F12。问题解决了。呵呵。。。
</li>
<li>嗯嗯、谢谢哈、我只是想知道用DIV排表格的方法。
还有、我觉得有必要澄清一下、哥们，咱是女的。。。</li>
<li>1111111111111111111111111111111111111111111</li>
<li>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
<li>17</li>
<li>18</li>
<li>19</li>
<li>20</li>
<li>21</li>
<li>word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行。
它们的区别就在于：
1，word-break:break-all 例如div宽200px，它的内容就会到200px自动换行，如果该行末端有个英文单词很长（congratulation等），它会把单词截断，变成该行末端为conra(congratulation的前端部分)，下一行为tulation（conguatulation）的后端部分了。
2，word-wrap:break-word 例子与上面一样，但区别就是它会把congratulation整个单词看成一个整体，如果该行末端宽度不够显示整个单词，它会自动把整个单词放到下一行，而不会把单词截断掉的。</li>
<li>22</li>
<li>23</li>
<li>24</li>
<li>25</li>
<li>26</li>
<li>27</li>
<li>28</li>
<li>29</li>
<li>30</li>
<li>31</li>
<li>32</li>
<li>33</li>
<li>34</li>
<li>35</li>
<li>36</li>
</ul>
</body>
</html>
分享到：
相关推荐
在网页设计中，使用`div`和`CSS`来模拟表格对角线是一种常见的技术，尤其是在需要自定义样式或者在不支持`<table>`元素的环境中。本篇将详细讲解如何利用`div`和`CSS`实现这一效果，并通过提供的`demo.html`文件中的...
div+css模拟表格对角线功能，div+css模拟表格对角线功能
用div css模拟表格对角线 用div css模拟表格对角线
在这段给定的文件信息中，涉及到的核心知识点是使用DIV和CSS来模拟表格的效果。CSS是层叠样式表（Cascading Style Sheets）的简称，是设计网页样式的标准语言，它定义了网页内容的布局、排版、颜色、字体以及各种...
在这个例子中，我们将使用TextField组件来模拟表格的单元格，因为TextField可以显示和编辑文本。 1. **创建数据存储结构**： 我们使用JavaScript的Array类型来存储表格内容。在Start()函数中，初始化一个一维数组...
本文介绍了如何使用`<dl>`、`<dt>`和`<dd>`元素结合CSS来模拟表格布局。`<dl>`代表定义列表（Definition List），`<dt>`用于定义术语或名词（Definition Term），而`<dd>`则用于描述或定义这些术语（Definition ...
CSS模拟表格斜线的知识点主要涉及边框、定位以及绝对定位等CSS技术。下面详细说明如何使用CSS来模拟实现表格的对角线效果： 首先，我们知道HTML中的表格（table）是由多个单元格（td、th）组成的，如果要为表格添加...
标题“listview实现表格效果，带表格线”表明我们要讨论的是如何利用ListView来模拟表格布局，并添加分割线以清晰地展示每个单元格的边界。 首先，我们要理解ListView的基本结构。ListView由多个ListView项...
标题中的“EXCEL上PID模拟”指的是使用Microsoft Excel软件进行比例积分微分（PID）控制器的模拟和设计。PID控制器是一种广泛应用的自动控制算法，它通过综合比例、积分和微分三个部分的输出来调整系统的控制量，以...
通过控制字符和换行符，可以模拟表格结构。例如，可以创建一个函数，接受行数、列数和单元格内容作为参数，然后在`RichTextBox`中插入相应的文本。 **二、`RichTextBox`表格的打印** `RichTextBox`的打印功能主要...
例如，通过将`display`属性设置为`table-cell`，我们可以让`div`元素模拟表格单元格的行为，从而实现更复杂的响应式布局。这在处理动态数据或需要自定义单元格布局时非常有用。 `div`元素常作为容器，通过CSS的`...
1. **CSS Display属性**：在CSS中，可以使用`display`属性将div元素模拟为表格单元格（`<td>`）或表格行（`<tr>`）。例如，设置`display: table-cell`和`display: table-row`可以让div元素模仿table的行为。 2. **...
总结来说，这个教程展示了如何通过CSS布局技巧，使用`<ul>`和`<li>`元素模拟表格布局，这种技术适用于需要灵活布局或响应式设计的情况，同时也提醒我们在适合的时候仍应优先考虑使用HTML表格元素。
在表格合并的实现中，你需要使用`<view>`或`<block>`标签来模拟表格结构，通过条件渲染和循环遍历数据来生成表格单元格。为了实现合并效果，你可能会利用`wx:if`和`wx:for`等指令控制不同单元格的显示。此外，可以...
为了模拟表格的行和列，我们可以在每个Grid单元格内放置一个Border，通过设置Border的`BorderBrush`和`BorderThickness`属性来实现边框效果。 5. **插入控件** 使用`Grid.SetColumn`和`Grid.SetRow`方法可以指定...
本教程将详细介绍如何使用CSS和JavaScript来实现一个类似表格的动态滚动效果，通过`ul`和`li`标签来模拟表格结构。 ### CSS基础布局 首先，我们需要创建一个容器来包裹我们的“表格”。这可以通过`<div>`标签实现...
在实现自定义表格编辑时，我们需要创建一个QML组件来模拟表格的行为。这个组件可能会包含以下部分： 1. **Item布局**：使用QML的`Rectangle`或`Item`作为基础元素，定义表格的边界和背景色。然后，使用`Column`和`...