文档章节

CSS自动换行 强制不换行

DickerYang
 DickerYang
发布于 2016/06/02 16:02
字数 221
阅读 1
收藏 0
<!doctype html>
<html>
  <head>
    <!--网站编码格式,UTF-8 国际编码,GBK或 gb2312 中文编码-->
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta name="Keywords" content="关键词一,关键词二">
    <meta name="Description" content="网站描述内容">
    <meta name="Author" content="Yvette Lau">
    <title>
      Document
    </title>
    <!--css js 文件的引入-->
    <style>
      .word{background:#E4FFE9;width:250px;margin:50px auto;padding:20px;font-family:"microsoft
      yahei";} /* 强制不换行 */ .nowrap{white-space:nowrap;} /* 允许单词内断句,首先会尝试挪到下一行,看看下一行的宽度够不够,
      不够的话就进行单词内的断句 */ .breakword{word-wrap: break-word;} /* 断句时,不会把长单词挪到下一行,而是直接进行单词内的断句
      */ .breakAll{word-break:break-all;} /* 超出部分显示省略号 */ .ellipsis{text-overflow:ellipsis;overflow:hidden;}
    </style>
  </head>
  
  <body>
    <div>
      <p>wordwrap:breakword;absavhsafhuafdfbjhfvsalguvfaihuivfs</p>
      <p>wordwrap:break-word;absavhsafhuafdfbjhfvsalguvfaihui</p>
      <p>wordwrap:break-word;absavhsafhuafdfbjhfvsalguvfaihuivf</p>
      <p>wordwrap:breakword;absavhsafhuafdfbjhfvsalguvfaihuivfsa</p>
      <p>wordwrap:breakword;absavhsafhuafdfbjhfvsalguvfaihuivfsab</p>
    </div>
  </body>
</html>

 

© 著作权归作者所有

DickerYang
粉丝 0
博文 1
码字总数 221
作品 0
安康
私信 提问
[转载]css控制文字换行

.zjtext{ font-size:12px; color:#fff; padding:5px; width:100px;white-space:normal; overflow:hidden; } 以上是我引用的,关键语:white-space:normal; overflow:hidden; 强制不换行 p.ww......

Kilar
2015/12/08
13
0
div、p、td 的强制不换行及强制换行

关于强制不换行、强制换行的话题在网上已经被讨论了无数次,但我发现都不够全面,没有充分考虑各种浏览器、各种标签等情况,以致不兼容,所以我再来说说。由于 div 和 p 在本文的讨论中,效果...

王超
2014/03/20
1K
0
Web前端设计:Html强制不换行标签用法代码示例

在网页排版布局中比如文章列表标题排版,无论多少文字均不希望换行显示,需要强制在一行显示完内容。这就可以nobr标签来实现。它起到的作用与word-break:keep-all 是一样的。nobr 是 No Bre...

小星星程序员
2014/11/16
1K
0
页面数据展示的太长,怎么让他自动换行

自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字...

元来元去
2010/11/22
603
0
CSS3 文本效果

CSS3 文本效果 CSS3中包含几个新的文本特征。 在本章中您将了解以下文本属性: text-shadow word-wrap 浏览器支持 Internet Explorer 10, Firefox,Chrome, Safari, 和 Opera支持text-shadow...

wybo521
2016/01/23
20
0

没有更多内容

加载失败,请刷新页面

加载更多

用原生js对表格排序

本文转载于:专业的前端网站➸用原生js对表格排序 阿里的模拟笔试题,当时时间有限没写出来,其实是因为自己对原生dom操作不熟悉,这里补一下。 题目的大意是有一个表格,如代码所示 <table>...

前端老手
30分钟前
4
0
IT兄弟连 HTML5教程 HTML5表单 HTML5新增表单元素

HTML5有一些新的表单元素:<datalist>、<keygen>、<output>。不是所有的浏览器都支持HTML5新的表单元素,但即使浏览器不支持该表单属性,仍然可以显示为常规的表单元素。 1 <datalist>元素 ...

老码农的一亩三分地
31分钟前
4
0
【朝花夕拾】Android自定义View篇之(一)View绘制流程

https://www.cnblogs.com/andy-songwei/p/10955062.html

shzwork
33分钟前
5
0
Qt编写自定义控件70-扁平化flatui

一、前言 对于现在做前端开发人员来说,FlatUI肯定不陌生,最近几年扁平化的设计越来越流行,大概由于现在PC端和移动端的设备的分辨率越来越高,扁平化反而看起来更让人愉悦,而通过渐变色产...

飞扬青云
43分钟前
3
0
教你玩转Linux—添加批量用户

添加和删除用户对每位Linux系统管理员都是轻而易举的事,比较棘手的是如果要添加几十个、上百个甚至上千个用户时,我们不太可能还使用useradd一个一个地添加,必然要找一种简便的创建大量用户...

Linux就该这么学
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部