I liked this: Tip中小三角的实现

7 8月

前段时间专门研究了一下腾讯微博的Tip,很有意思!tip中的小箭头是用“◆”(encode为:◆)字符模拟的。以前也写过类似的实现方案《用css的border属性实现三角》。用“◆”字符模拟小三角有一个有点就是:比如tip有border时,也可以用两个绝对定位的“◆”字符模拟。如图: 注意:最好根据您的实际情况设置“◆”的字体,我这里用了宋体,有棱有角真好! demo页面:http://www.css88.com/demo/tipbox/ 声明: 本文采用 BY-NC-SA 协议进行授权 | WEB前端开发转载请注明转自《Tip中小三角的实现》
posted on WEB前端开发: http://www.css88.com/archives/3904

Advertisements

发表评论

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 更改 )

Twitter picture

You are commenting using your Twitter account. Log Out / 更改 )

Facebook photo

You are commenting using your Facebook account. Log Out / 更改 )

Google+ photo

You are commenting using your Google+ account. Log Out / 更改 )

Connecting to %s

%d 博主赞过: