前端开发设置文本不换行

normal：正常显示，如果宽度不够进行折行显示

nowrap：即使超过盒子的宽度，文本也不进行换行显示

pre：写html代码的时候是什么样式，就显示成什么样式

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>我是中国人</title>

        <style>
            p {
                background-color: red;
                height: 400px;
                width: 300px;
            }

            .p1 {
                white-space: pre;
            }

            .p2 {
                white-space: nowrap;
            }
        </style>
    </head>
    <body>
        <p class="p1">
            据俄罗斯卫星通讯社9日报道，在与亚阿领导人进行一系列通话后，
            普京呼吁双方出于人道主义考虑停止在纳卡地区的作战行动，
            以交换死者遗体和俘虏。他邀请两国外长周五赴俄就纳卡局势进行磋商。
            亚阿两国外长9日启程前往莫斯科。俄总统新闻秘书佩斯科夫表示，
            纳卡问题外长级会谈将于9日15时在莫斯科举行。
            不过当天的会谈比这个时间推迟了约一个半小时。在会谈开始后，
            俄外交部发言人扎哈罗娃在脸书发布一张俄亚阿外长坐在圆桌旁的照片
        </p>
        <p class="p2">
            阿塞拜疆国防部称，从8日下午到9日上午，纳卡前线的战斗仍十分激烈。亚外交部新闻秘书9日表示，亚俄阿外长9日会谈的议题将仅限于停火和人道主义问题。法新社援引法国总统府的消息称，亚阿可能会在9日晚上或10日在纳卡地区实现停火，不过停火协议可能会很脆弱。佩斯科夫拒绝对这一报道发表评论。他表示，克里姆林宫没有关于亚阿即将停战的消息
        </p>
    </body>
</html>

image

posted @ 2020-10-10 13:36  thomas_blog  阅读(1660)  评论(0)  编辑  收藏  举报