Tip中小三角的实现

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

相关 [tip 三角] 推荐:

Tip中小三角的实现

- 溪梦 - WEB前端开发
前段时间专门研究了一下腾讯微博的Tip,很有意思. tip中的小箭头是用“◆”(encode为:◆)字符模拟的. 以前也写过类似的实现方案《用css的border属性实现三角》. 用“◆”字符模拟小三角有一个有点就是:比如tip有border时,也可以用两个绝对定位的“◆”字符模拟. 如图: 注意:最好根据您的实际情况设置“◆”的字体,我这里用了宋体,有棱有角真好.

HBase的一些应用设计tip

- - BlogJava_首页
1,对于HBase的存储设计,要考虑它的存储结构是:rowkey+columnFamily:columnQualifier+timestamp(version)+value = KeyValue in HBase,一个KeyValue依次按照rowkey,columnkey和timestamp有序.

weka特征预处理的一些tip

- - BlogJava-首页技术区
首先,提供两个地址,这里包含了全部的内容原文:. weka可以以目录形式读入数据. 然后再简单说一下weka在做文本特征内容处理时候需要注意的东西:. 声明一点,在weka的gui下是没法使用这个功能的:以目录形式读入数据. 首先,把要处理的数据写入到这样的目录结构下:. 然后在源码包下,命令行执行 java weka.core.converters.TextDirectoryLoader -dir text_example > text_example.arff.

玩mysql必须知道的10个tip

- - SQL - 编程语言 - ITeye博客
比如我的mysql是用源码方式安装在/usr/local/mysql. 自动:将/usr/local/mysql/share/mysql/mysql.server拷贝到/etc/rc.d/init.d/下,然后. chkconfig --add mysql.server就可以开机就启动mysql服务了.

小tip:巧用CSS3属性作为CSS hack

- 逸川 - 张鑫旭-鑫空间-鑫生活
本文地址:http://www.zhangxinxu.com/wordpress/?p=1867. 题目:实现类似下图的宽度自适应效果,IE9+,FireFox,Chrome,Opera等使用CSS3实现,IE6~8浏览器使用图片实现. ————- 假设这是大家全神贯注思考的18分钟 ————————.

小tip: 使用CSS将图片转换成黑白的

- - 张鑫旭-鑫空间-鑫生活
本文地址: http://www.zhangxinxu.com/wordpress/?p=2547. //zxx: 最近很积极地折腾手机页面的些东西,加上其他一些人生重要的事,所以木有更新. 可能早就知道,像汶川这种糟糕的日子网站全灰在IE下是可以轻松实现的( filter: gray;),不过,当时,其他浏览器是无解的.

小tip: CSS后代选择器可能的错误认识

- - 张鑫旭-鑫空间-鑫生活
本文地址: http://www.zhangxinxu.com/wordpress/?p=2286. 一、关于类选择器的一个问题. 假设有下面一个面试题,CSS代码如下:. 问:第一行和第二行文字颜色分别是. 这个例子很简单,我估计基本上都能回答正确:DOM越深的类名权重越高,因此,第一行文字红色,第二行文字绿色第一行文字绿色,第二行文字红色.

一个简单的鉴别密码强度的jquery tip

- - jackyrong
已有 0 人发表留言,猛击->> 这里<<-参与讨论. —软件人才免语言低担保 赴美带薪读研.

小tip: SVG和Canvas分别实现图片圆角效果

- - 张鑫旭-鑫空间-鑫生活
本文地址: http://www.zhangxinxu.com/wordpress/?p=4242. 一、图片覆盖和CSS3 border-radius实现圆角. 找个中间镂空的图片覆盖在原始图片上,需要跟网页底色一致. 上面两个方法demo有,截图有~. 可是demo上的图片素材一不小心放了个大,我不想换图片,地址就不放了,大家可以YY下.

小tip: 使用SVG寥寥数行实现圆环loading进度效果

- - 张鑫旭-鑫空间-鑫生活
本文地址: http://www.zhangxinxu.com/wordpress/?p=4889. 设计师设计了一个图片上传圆环loading进度效果. 首先,CSS3是可以实现的,以前写过一篇转大饼的文章:“ CSS3实现鸡蛋饼饼状图loading等待转转转”. 原理跟这个一模一样,两个半区的矩形,然后不同时机巧妙显隐实现.