首页 web前端 html教程 利用边框border的属性做小符号_html/css_WEB-ITnose

利用边框border的属性做小符号_html/css_WEB-ITnose

Jun 24, 2016 pm 12:05 PM
border 使用 属性 边框

前两天学习中,发现网站上的一个小符号,以为是插入的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来做符号非常有趣,就所见所得,拿来即用吧。

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1663
14
CakePHP 教程
1420
52
Laravel 教程
1313
25
PHP教程
1266
29
C# 教程
1239
24
Windows 11 上调整窗口边框设置的方法:更改颜色和大小 Windows 11 上调整窗口边框设置的方法:更改颜色和大小 Sep 22, 2023 am 11:37 AM

Windows11将清新优雅的设计带到了最前沿;现代界面允许您个性化和更改最精细的细节,例如窗口边框。在本指南中,我们将讨论分步说明,以帮助您在Windows操作系统中创建反映您的风格的环境。如何更改窗口边框设置?按+打开“设置”应用。WindowsI转到个性化,然后单击颜色设置。颜色更改窗口边框设置窗口11“宽度=”643“高度=”500“>找到在标题栏和窗口边框上显示强调色选项,然后切换它旁边的开关。若要在“开始”菜单和任务栏上显示主题色,请打开“在开始”菜单和任务栏上显示主题

如何利用GitLab进行项目文档管理 如何利用GitLab进行项目文档管理 Oct 20, 2023 am 10:40 AM

如何利用GitLab进行项目文档管理一、背景介绍在软件开发过程中,项目文档是非常重要的资料,不仅能够帮助开发团队了解项目的需求和设计,还能提供给测试团队和客户参考。为了方便项目文档的版本控制和团队协作,我们可以利用GitLab来进行项目文档管理。GitLab是一个基于Git的版本控制系统,除了支持代码管理,还可以管理项目文档。二、GitLab环境搭建首先,我

如何在Python中获取整数字面量属性而不是SyntaxError? 如何在Python中获取整数字面量属性而不是SyntaxError? Aug 20, 2023 pm 07:13 PM

要获得intliteral属性而不是语法错误,请使用空格或括号。intliteral是Python中NumericLiterals的一部分。NumericLiterals还包括以下四种不同的数字类型 - int(有符号整数) - 它们通常被称为整数或整数,是正数

如何在Java中使用Gson重命名JSON的属性? 如何在Java中使用Gson重命名JSON的属性? Aug 27, 2023 pm 02:01 PM

Gson@SerializedName注释可以序列化为JSON,并将提供的名称值作为其字段名称。此注释可以覆盖任何FieldNamingPolicy,包括可能已在Gson实例上设置的默认字段命名策略。可以使用GsonBuilder类设置不同的命名策略。语法@Retention(value=RUNTIME)@Target(value={FIELD,METHOD})public@interfaceSerializedName示例importcom.google.gson.annotations.*;

Python的dir()函数:查看对象的属性和方法 Python的dir()函数:查看对象的属性和方法 Nov 18, 2023 pm 01:45 PM

Python的dir()函数:查看对象的属性和方法,需要具体代码示例摘要:Python是一种强大而灵活的编程语言,其内置函数和工具为开发人员提供了许多方便的功能。其中一个非常有用的函数是dir()函数,它允许我们查看一个对象的属性和方法。本文将介绍dir()函数的用法,并通过具体的代码示例来演示其功能和用途。正文:Python的dir()函数是一个内置函数,

excel边框设置方法科普 excel边框设置方法科普 Mar 20, 2024 am 10:30 AM

Excel出现在我们日常工作和生活中已经不是一件罕见的事情了,无论是员工信息、工资表的制作或者是学生入学信息和成绩单的制作,Excel都是一款比较好用的工具。当要对Excel进行打印的时候需要设置边框来实现打印需求。本文小编为大家科普几个Excel边框设置方法。方法1、利用功能选项卡按钮,这应该是大家经常用的方法,方便快捷,具体操作:选中需要添加边框的单元格区域B2:H10,依次点击【开始】选项卡-【边框】右侧下拉按钮-【所有框线】,完成添加框线。方法2、选中需要添加边框的单元格区域B2:H10

如何在 Microsoft Word 中制作自定义边框 如何在 Microsoft Word 中制作自定义边框 Nov 18, 2023 pm 11:17 PM

想让你的学校项目的头版看起来令人兴奋吗?没有什么比工作簿首页上的漂亮、优雅的边框更能使其从其他提交中脱颖而出了。但是,MicrosoftWord中的标准单行边框已经变得非常明显和无聊。因此,我们展示了在MicrosoftWord文档中创建和使用自定义边框的步骤。如何在MicrosoftWord中制作自定义边框创建自定义边框非常容易。但是,您将需要一个边界。第1步–下载自定义边框互联网上有大量的免费边界。我们已经下载了一个这样的边框。第1步–在Internet上搜索自定义边框。或者,您可以转到剪贴

炉石传说绝望线缕属性介绍 炉石传说绝望线缕属性介绍 Mar 20, 2024 pm 10:36 PM

绝望线缕是暴雪娱乐旗下佳作《炉石传说》中的一张稀有卡牌,在“威兹班的工坊”卡包中有机会获得。可消耗100/400点奥术之尘合成普通/金色版本。炉石传说绝望线缕属性介绍答:在威兹班的工坊卡包中有几率获得,也也可以通过奥术之尘合成。稀有度:稀有类型:法术职业:死亡骑士法力值:1效果:使所有随从获得亡语:对所有随从造成1点伤害

See all articles