显示效果


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的主要作用是在内容前面添加指定内容，与之相反的是:after */.tu:before{/* outline是绘制于元素周围的一条线，位于边框边缘的外围，课起到突出元素的作用，ps:在边框外面 */outline: 2px solid #A52A2A;}.ao:before{content: 'love你love';}.tu{/* 设置元素的文本方向：ltr：默认 内容从向右流动 rtl：内容从右向左流动 inherit：从父元素继承 */direction: rtl;}.tu:before{content: '我love你';}