首頁 > web前端 > css教學 > 如何使用css實現文字環繞

如何使用css實現文字環繞

不言
發布: 2018-07-14 17:36:25
原創
2633 人瀏覽過

這篇文章主要介紹了關於如何使用css實現文字環繞,有著一定的參考價值,現在分享給大家,有需要的朋友可以參考一下

html:

#
<p class="wrap-p-topSpacer"></p>
    <p class="wrap-p">
        <img src="image/tineng1.png" 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%;
}
登入後複製

頁面效果:

以上就是本文的全部內容,希望對大家的學習有所幫助,更多相關內容請關注PHP中文網!

相關推薦:

如何使用CSS3來實現文字摺紙的效果

CSS 設定捲軸樣式的實例程式碼

以上是如何使用css實現文字環繞的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板