CSS怎么画“凹““凸“?

1、这里我们利用到的CSSwidth属性的首选最小宽度特性。

所谓“首选最小宽度”，指的是元素最适合的最小宽度。

2、

在 CSS 世界中，图片和文字的权重要远大于布局，因此，CSS 的设计者显
然是不会让图文在 width:auto 时宽度变成 0 的，此时所表现的宽度就是“首选最小宽度”。
具体表现规则如下。
• 东亚文字（如中文）最小宽度为每个汉字的宽度，
如图 3-11 所示的 14。 • 西方文字最小宽度由特定的连续的英文字符单元
决定。并不是所有的英文字符都会组成连续单元，
一般会终止于空格（普通空格）、短横线、问号以
及其他非英文字符等。例如，“display:inlineblock”这几个字符以连接符“-”作为分隔符，形
成了“display:inline”和“block”两个连续
单元，由于连接符“-”分隔位置在字符后面，因此，
最后的宽度就是“display:inline-”的宽度，

.ao {
    
     
 display: inline-block; 
 width: 0; 
} 
.ao:before {
    
     
 content: "love 你 love"; 


 outline: 2px solid #cd0000; 
 color: #fff; 
}

3、摘自：《CSS世界》