最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

利用边框border的属性做小符号_html/css

来源:动视网 责编:小采 时间:2020-11-27 15:52:56
文档

利用边框border的属性做小符号_html/css

利用边框border的属性做小符号_html/css_WEB-ITnose:前两天学习中,发现网站上的一个小符号,以为是插入的img,但找来找去也未发现img的地址。最后问了同学,才得知是用border属性做出来的。 符号如右: 其css代码如下: .fuhao{ position:absolute; top:12px; left:12px; width:0p
推荐度:
导读利用边框border的属性做小符号_html/css_WEB-ITnose:前两天学习中,发现网站上的一个小符号,以为是插入的img,但找来找去也未发现img的地址。最后问了同学,才得知是用border属性做出来的。 符号如右: 其css代码如下: .fuhao{ position:absolute; top:12px; left:12px; width:0p


前两天学习中,发现网站上的一个小符号,以为是插入的img,但找来找去也未发现img的地址。最后问了同学,才得知是用border属性做出来的。

符号如右:

其css代码如下:

.fuhao{ position:absolute; top:12px; left:12px; width:0px; height:0px; overflow:hidden; border-width:6px 0px 6px 6px; border-color:transparent #A92222; border-style:dashed none dashed solid;}

这里是利用一个空的div即fuhao,给它定义好位置后,让它高度和宽度都为0,但边框具有宽度。那么这个div里面什么有没有,只剩下边框。

按道理来说应该是这样的:

然后下面的语句给上下边框做了透明transparent处理,右边框做0px处理,就得出了那个符号了。

其实,我也不是很明白,但觉得用边框border来做符号非常有趣,就所见所得,拿来即用吧。

文档

利用边框border的属性做小符号_html/css

利用边框border的属性做小符号_html/css_WEB-ITnose:前两天学习中,发现网站上的一个小符号,以为是插入的img,但找来找去也未发现img的地址。最后问了同学,才得知是用border属性做出来的。 符号如右: 其css代码如下: .fuhao{ position:absolute; top:12px; left:12px; width:0p
推荐度:
标签: 利用 边框 边框的
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top