htmltable为什么会横排显示呢

html-css063

htmltable为什么会横排显示呢,第1张

列过多时会出现table横向溢出。页面Model嵌套一个动态table，table列根据后台数据动态渲染，不固定，当列过多时会出现table横向溢出。加横向滚动条：overflow-x：auto；能解决横向溢出问题。思路如下：

1、table的外层div样式设置为横向内容大于div宽度时变成滚条的形式并且宽度设置一个初始值：overflow-x：auto；width：660px。

2、每次浏览器尺寸发生改变时，获取一次Modle的宽度，根据Model的宽计算出table外层div的宽度，改变div的宽度。

利用Dreamweaver新建一个html页面，

在body里面输入代码

<ul>

<li>xx</li>

<li>xx</li>

<li>xx</li>

</ul>

编辑li标签的css样式

float:left代表的是元素左对齐。这样li标签就可以横排显示了，list-style:none用来去除li标签前面的小圆点。

一个网页对应多个HTML文件，超文本标记语言文件以.htm（磁盘操作系统DOS限制的外语缩写）为扩展名或.html（外语缩写）为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件，只用修改文件后缀即可。标准的超文本标记语言文件都具有一个基本的整体结构，标记一般都是成对出现（部分标记除外例如：<br/>），即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html，编写问题基础代码。

2、在index.html中的<caption>标签中，添加样式代码：style="white-space : nowrap"。

3、浏览器运行index.html页面，此时表格内部表格的标题文字会横着显示。