css怎么设置显示一行

 时间:2024-10-02 01:29:00

html网页制作中,文本要一行显示是经常遇到的问题,下面是解决的方法。

工具/原料

html编辑器sublimeText

方法/步骤

1、首先打开html编辑器sublimeText,如下图

css怎么设置显示一行

2、正常解决思路:设定文本长度,文本一行显示,多出的隐藏或者省略号显示。利用擢爻充种的css属性white-space:nowrap;,如下图

css怎么设置显示一行

3、利用的css属性word-break:keep-all;,如下图

css怎么设置显示一行

4、下面是详细的代码操作,如下图

css怎么设置显示一行

5、最总例子显示效果,如下图例子一没有使用以上说的2个css属性:出现换行效果例子二使用以上说的2个css属性:没有换行效果

css怎么设置显示一行

6、最后附上全部代码,复制到html编乩态祗嚆辑器中就能实现效果<!DOCTYPEhtml><html><head><metach锾攒揉敫arset="UTF-8"><title>Document</title><style>*{margin:0;padding:0;}.wrap1,.wrap2{width:200px;border:1pxsolid#000000;margin:0auto;margin-bottom:20px;}.wrap1{word-wrap:break-word;}.wrap2{white-space:nowrap;word-wrap:break-all;}</style></head><body><p>111111111111111111111111111</p><p>22222222222222222222222222222</p></body></html>

如何用jquery给li标签加边框 css如何只设置一个html元素的上下边框 HTML中如何调节一个角的角度代码 如何使用CSS3中的属性选择器设置超链接样式 JSP页面添加背景音乐
热门搜索
蓝色的图片 唯美图片带字 夫妻成长日记 漫画 家庭教师邪恶漫画 高考图片