• 技术文章 >web前端 >前端问答

    html5文字怎么强制不换行

    长期闲置长期闲置2022-06-15 10:40:40原创161

    在html5中,可以利用style属性配合“white-space”属性来设置文字强制不换行;style属性用于设置元素的样式,“white-space”属性用于指定元素内的空白怎么处理,当“white-space”属性值被设置为nowrap时,文本就不会换行,直到遇到“<br>”标签,语法为“<element style="white-space:nowrap">”。

    本教程操作环境:windows10系统、CSS3&&HTML5版本、Dell G3电脑。

    html5文字怎么强制不换行

    white-space属性指定元素内的空白怎样处理。

    示例如下:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"> 
    <title>123</title> 
    <style>
    div{
    width: 120px;
    height: 60px;
    line-height: 20px;
    border: 1px solid red;
    }
    </style>
    </head>
    <body>
    <div style="white-space:nowrap">
    This is some text. This is some text.
    </div>
    <div>
    This is some text. This is some text.
    </div>
    </body>
    </html>

    输出结果:

    02.png

    (学习视频分享:css视频教程html视频教程

    以上就是html5文字怎么强制不换行的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css html5
    上一篇:jquery怎么给text文本框设置只读状态 下一篇:jquery.parsejson转义怎么用
    20期PHP线上班

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• html5的首行代码是什么• html5包含css吗• html5表单域是什么意思• swf能转为html5吗• HTML5文件元素的分类有哪些
    1/1

    PHP中文网