迅彩广告
咨询热线:0757-8533 5243
图文   广告   标书   印刷

好看的文章排版样式

发表时间:2021-01-12 16:13

好看的文章排版样式

左边框,浅色背景内容块,代码如下:
<p style="border-left: 4px solid #cc0417; background: #ffcfd4; color: #b30011; padding: 2px 0 2px 10px;">左边框,浅色背景内容块,代码如下:</p>

这是模块说明有细边框包围,上边框有说明的内容块,代码如下:
<p style="position: relative; margin: 30px 0 0; border: 1px solid #ae0006; border-radius: 5px; color: #ae0006; padding: 20px 10px;">
<span style="position: absolute; left: 50px; top: -12px; background: #ae0006; color: #fff; padding: 2px 10px;">这是模块说明</span>
有细边框包围,上边框有说明的内容块,代码如下:
</p>

四个角有角标的内容块,代码如下:
<p style="margin-top:30px;">
<span style="display: block; height: 6px; width: 100%; zoom: 1;">
<span style="display: block; float: left; width: 6px; height: 100%; border-left: 2px solid #ae0006; border-top: 2px solid #ae0006;">&nbsp;</span><span style="display: block; float: right; width: 6px; height: 100%; border-right: 2px solid #ae0006; border-top: 2px solid #ae0006;">&nbsp;</span>
</span>
<span style="display: block; margin: -2px 4px -3px; padding: 10px; background: #ffcfd4; color: #ae0006; border: 1px solid #ae0006;">四个角有角标的内容块,代码如下:</span>
<span style="display: block; height: 6px; width: 100%; zoom: 1;">
<span style="display: block; float: left; width: 6px; height: 100%; border-left: 2px solid #ae0006; border-bottom: 2px solid #ae0006;">&nbsp;</span><span style="display: block; float: right; width: 6px; height: 100%; border-right: 2px solid #ae0006; border-bottom: 2px solid #ae0006;">&nbsp;</span>
</span>
</p>


好看的文章排版样式




会员登录
登录
其他账号登录:
我的资料
留言
回到顶部