仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 732|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 来一发CSS教程:表格不被撑开的办理举措

[复制链接]
小妖女 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-15 23:35:02 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
一般来说还需要用Photoshop或FireWorks(以下简称PS或FW)等图片处理软件将需要制作的界面布局简单的构画出来。
网页制造poluoluo文章简介:办理举措:先用noWrap强行令笔墨不换行,再用style="table-layout:fixed;;word-break:break-all;;border-collapse:collapse"强迫表格不撑开,即到达效果。
明天在做一个用户留言列表的时分,用到了表格。用户名为英笔墨符时,就会把流动宽度的单位格撑开。之前也有碰到过。办理举措:先用noWrap强行令笔墨不换行,再用style="table-layout:fixed;;word-break:break-all;;border-collapse:collapse"强迫表格不撑开,即到达效果。
必要注重的是:用了nowrap的单位格设置的宽度要用百分比,否则仍是会撑开。我们能够给表头的单位格设置宽度。火狐下还要在td内里嵌套一个div。

附:

nowrap:一样平常用在td中克制主动换行

table-layout:auto|fixed
auto: 默许值。默许的主动算法。结构将基于各单位格的内容。表格在每单位格内一切内容读取盘算以后才会显现出来
fixed: 流动结构的算法。在这类算法中,表格和列的宽度取决于col工具的宽度总和,假设没有指定,则会取决于第一行每一个单位格的宽度。假设表格没有指定宽度(width)属性,则表格被呈递的默许宽度为100%。

word-break:break-allword-wrap:break-word都是能使其容器如DIV、TD的内容主动换行。
word-break:normal|break-all|keep-all
word-wrap:normal|break-word
它们的区分就在于:

1,word-break:break-all比方div宽200px,它的内容就会到200px主动换行,假如该行末了有个英文单词很长(congratulation等),它会把单词截断,酿成该行末了为conra(congratulation的前端部分),下一举动tulation(conguatulation)的后端部分了。

2,word-wrap:break-word例子与下面一样,但区分就是它会把congratulation全部单词当作一个全体,假如该行末了宽度不敷显现全部单词,它会主动把全部单词放到下一行,而不会把单词截断失落的。

border-collapse:separate|collapse
取值:
separate: 默许值。边框自力(尺度HTML)
collapse: 相邻边被兼并
Div全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。
小女巫 该用户已被删除
沙发
发表于 2015-1-17 23:24:42 | 只看该作者
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。
透明 该用户已被删除
板凳
发表于 2015-1-23 13:31:44 | 只看该作者
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。
只想知道 该用户已被删除
地板
发表于 2015-1-31 18:50:24 | 只看该作者
难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心,坚持不懈的决心。在自己无法解决某些问题时,就需要虚心请教别人.
莫相离 该用户已被删除
5#
发表于 2015-2-6 22:40:46 | 只看该作者
经过两天的学习,总算对Dreamweaver有进一步的了解了,心中不免有些激动。今天和其他几位老师交流了一下,感觉受益匪浅.
精灵巫婆 该用户已被删除
6#
发表于 2015-2-19 04:39:53 | 只看该作者
Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。
柔情似水 该用户已被删除
7#
发表于 2015-3-6 13:07:35 | 只看该作者
是当我和赵丽芬崔明艳老师进行交流后,很快就了解了还不太清楚的内容和并不了解的知识(像布局表格、绘制布局单元格等)。
分手快乐 该用户已被删除
8#
发表于 2015-3-13 02:09:05 | 只看该作者
还是在Dreamweaver所见即所得添加链接是,可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。
冷月葬花魂 该用户已被删除
9#
发表于 2015-3-20 10:14:11 | 只看该作者
俗话说:兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中,我们难免会遇到各种各样的问题。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-23 07:56

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表