How to implement text wrapping using css

This article mainly introduces how to use css to realize text wrapping. It has certain reference value. Now I share it with you. Friends in need can refer to it

html:

<p class="wrap-p-topSpacer"></p>
    <p class="wrap-p">
        <img src="/static/imghwm/default1.png"  data-src="image/tineng1.png"  class="lazy"   alt="">
    </p>
    <p style="font-size: 16px;text-indent: 2rem;">通过体能测试获得基本数据资料，由此找到幼儿体能训练的更好方法，以促进幼儿体能的提高，测试结果也将为幼儿园调整户外体育活动的组织形式，开展体育区域活动，变“集中统一活动”为“分区自主活动”，变“同年龄班活动”为“混龄班活动”，创设开放性的体育活动环境提供科学数据和对比依据。充分利用测试结果发现问题，“用幼儿感兴趣的方式发展基本动作，提高动作的协调性、灵活性以及平衡性”，逐步形成园本教育特色，打造园所教育品牌，凸现园所文化，为孩子一生运动能力和良好运动习惯打下基础。</p>

css：

p.wrap-p-topSpacer {
    width: 0px;
    height: 40px;
    float: left;
}p.wrap-p {
    float: left;
    clear: both;
    margin: 10px 25px 0 0;
    width: 25%;
    text-align: center;
    background: #0088cc;
    color: #FFF;
}p.wrap-p-right {
    float: right;
    width: 50%;
}

Page effect:

The above is the entire content of this article. I hope it will be helpful to everyone's study. For more related content, please pay attention to the PHP Chinese website!

Related recommendations:

How to use CSS3 to achieve the effect of text origami

CSS example code for setting scroll bar style

The above is the detailed content of How to implement text wrapping using css. For more information, please follow other related articles on the PHP Chinese website!