欢迎来到5分享! 微信公众号   新浪微博

5分享

技术类别:
当前位置: 主页 > 技术分享 > 程序开发 >

html CSS中强制ul li中的文字换行

时间:2018-08-06 13:09来源:原创 作者:5分享 点击:
//white-space -- 通过HTML文档的源代码的排版方式控制页面显示文本的排版方式取值: normal | pre | nowrap | pre-wrap | pre-line | inherit

HTML例子:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<style type="text/css">

    li{

        display:block; 

        float:left; 

        width:50px;

        margin-right:8px; 

        white-space:normal; //white-space -- 通过HTML文档的源代码的排版方式控制页面显示文本的排版方式取值: normal | pre | nowrap | pre-wrap | pre-line | inherit


        word-break : break-all; 

        word-wrap: break-word;

    }

</style>

</head>


<body>

    <div>

        <ul>

            <li>这里是自动换行例子1</li>

            <li>这里是自动换行例子2</li>

            <li>这里是自动换行例子3</li>

            <li>这里是自动换行例子4</li>

            <li>这里是自动换行例子5</li>

            <li>这里是自动换行例子6</li>

        </ul>

    </div>

</body>

</html>


服务器,数据库问题系统问题,硬件报价,虚拟化,服务部署可以扫描下方二维码,添加技术支持,7*12小时在线解答或是QQ联系我们。

欢迎关注【5分享】(fivsha)   

5分享公众号.jpg

顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
最新评论
遇到困难可以给我发消息 遇到困难可以给我发消息