1500字范文,内容丰富有趣,写作好帮手!
1500字范文 > html nobr 无效 HTML元素nobr标签的使用方法及作用

html nobr 无效 HTML元素nobr标签的使用方法及作用

时间:2021-10-27 23:08:21

相关推荐

html nobr 无效 HTML元素nobr标签的使用方法及作用

html元素标签是英文“No Baeak”的缩写,意思是“禁止换行”,有关该标签的使用方法及作用详解如下:

HTML标签的定义

标签是强制不换行,即禁止换行;

属于双标签,禁止换行的文本必须放在和之间。

标签定义的文本元素的宽度,在超过浏览器窗口宽度或超过父标签容器(比如p、div等)的宽度时,也不会换行,不管该本文文字有多长,只要没有遇见

标签,就会始终在一行中显示。

HTML标签的语法

标签必须包含在开始标签和结束标签之间,其书写格式如下:这是一段强制不换行的内容

如果在标签内,不遇到br换行标签,内容始终会在单独在一行内显示,如遇到br换行标签,内容将在加br标签的位置进行自动换行。

HTML标签的用法

在默认情况下,当单行文本的长度超过了当前浏览器窗口宽度或容纳文本文字的父标签容器宽度时,是会默认换行的;为了在这两种情况下,不让单行文本换行,我们就需要使用标签来禁止换行,可以使过长的文本始终保持单行显示;

使用标签,可以让无论多长,字数多少,都可以单行显示在一条线上。

1、在文本长度超过浏览器窗口宽度时,使用标签禁止换行:这是一段文本长度超过浏览器宽度时,不换行的内容。

以上代码在IE浏览器中显示效果如下:

从上图可知,文本长度超过了浏览器显示文本的宽度时,使用了标签的文本始终单行显示在一条直线上,是不会换行的。

如果没有使用标签,也没有

标签换行的话,浏览器就会在文本达到浏览器窗口宽度时进行换行处理,效果如下图所示:

2、在文本长度超过容纳它的父标签容器宽度时,使用标签禁止换行:

下面,我们以

段落标签容器为例,设置它的宽度为200px,为了让大家看得更清楚,我们也设置p标签的背景为red(红色),演示代码如下:

这是一段文本长度超过父元素容器宽度时,有nobr标签就不换行的内容.

以上代码在IE浏览器中显示效果如下:

由上图可知,当标签定义的文本长度超过了p标签容器的宽度(也就是上图中红色区域的宽度)时,文本是不会换行的,也就是始终只会单行显示在一条直线上。

标签对应的CSS样式规则

由于<nobr>标签在html规范中,并未被采用,请尽量使用white-space:nowrap,代码演示如下:

这一段内容超出浏览器窗口的宽度,就会始终显示在单行的一条线上。

这二段内容超出父标签容器的宽度,就会始终显示在单行的一条线上。

以上两段代码在IE浏览器中显示效果如下:

注意事项:

如果被<nobr>标签定义的元素内容中也有

换行标签的话,浏览器会在有

标签的位置进行换行,而换行后的每行文本,依旧会按照标签规则单行显示在一条线上;也就是说,

标签在标签内也可以进行换行。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。