顯示效果


HTML

<span class="ao"></span> <span class="tu"></span>

CSS

.ao,.tu{display: inline-block;width: 0;font-size: 14px;line-height: 18px;margin: 35px;/* color: #fff; *//* 文字顏色 */}.ao:before,/* :before的主要作用是在內(nèi)容前面添加指定內(nèi)容，與之相反的是:after */.tu:before{/* outline是繪制于元素周圍的一條線，位于邊框邊緣的外圍，課起到突出元素的作用，ps:在邊框外面 */outline: 2px solid #A52A2A;}.ao:before{content: 'love你love';}.tu{/* 設(shè)置元素的文本方向：ltr：默認 內(nèi)容從向右流動 rtl：內(nèi)容從右向左流動 inherit：從父元素繼承 */direction: rtl;}.tu:before{content: '我love你';}

總結(jié)

以上是生活随笔為你收集整理的学习《css世界》笔记之使用css实现凹凸效果的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。