<!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

     <title>使用css画一个箭头</title>

     <style type="text/css">

         a{

             font-size:2rem;

             text-decoration: none;

             color: gray;

         }

         a:after{

             content: "";

             width: 1rem;

             height: 1rem;

             display: inline-block;

             border-top: 2px solid darkgray;

             border-right: 2px solid darkgray;

             transform: rotate(45deg);

         }

     </style>

 </head>

 <body>

     <a href="#">我曾把完整的镜子打碎</a>

 </body>

 </html>

效果如下：

使用css画一个箭头的更多相关文章

  1. CSS画一个三角形，CSS绘制空心三角形，CSS实现箭头

     壹 ❀ 引 这两天因为项目工作较少,闲下来去看了GitHub上关于面试题日更收录的文章,毕竟明年有新的打算.在CSS收录中有一题是 用css创建一个三角形,并简述原理 .当然对于我来说画一个三角形是 ...

  2. css画一个提示框

    用css画一个如下图的提示框: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  3. 【前端切图】用css画一个卡通形象-小猪佩奇

    最近在腾讯云技术社区遇到了一位奇才,用css画出了一个社会人小猪佩奇,不得不服.研究了一下他的文章https://segmentfault.com/a/1190000014909658,感觉甚是有趣, ...

  4. div+css画一个小猪佩奇

    用DIV+CSS画一个小猪佩奇,挺可爱的,嘻嘻. HTML部分(全是DIV) <!-- 小猪佩奇整体容器 --> <div class="pig_container&quo ...

  5. 用CSS画一个带阴影的三角形的示例代码

    1. 思路 怎么用CSS3画一个带阴影的三角形呢 ? 有童鞋说, 这还不简单吗 网上有很多解决方案, 但其实大多都是实现不太完美的, 存在一些问题 假设我们做一个向下的三角形箭头 常见的方法大致有两种 ...

  6. Effective前端3：用CSS画一个三角形

    p { text-indent: 2em } .triangle-container p { text-indent: 0 } img { margin: 15px 0 } 三角形的场景很常见,打开一 ...

  7. Effective前端1---chapter 2 用CSS画一个三角形

    1.CSS画三角形的画法 第一步:三角形可以用border画出来,首先一个有四个border的div长这样: <div class="triangle"></di ...

  8. Effective前端(3)用CSS画一个三角形

    来源:https://zhuanlan.zhihu.com/p/26160325 三角形的场景很常见,打开一个页面可以看到各种各样的三角形: 由于div一般是四边形,要画个三角形并不是那么直观.你可以 ...

  9. css实战#用css画一个中国结

    大家好!今天跟大家分享一个用 css 画中国结的教程.最终效果如下: 大家如果感兴趣可以参考我的源码:gitHub地址 首先,我们定义好画中国结需要的结构: <div class="k ...

随机推荐

  1. 【查漏补缺】File的path、absolutePath和canonicalPath的区别

    背景 在学习Idea的插件开发时,用到了相关的VirtualFileSystem这个东西,里面的VirtualFile有一个getCanonicalPath()方法引起了我的注意,我发现我不知道-- ...

  2. 日志收集ELK+kafka相关博客

    SpringBoot+kafka+ELK分布式日志收集 使用 logstash + kafka + elasticsearch 实现日志监控 Kibana 安装 与 汉化 windows系统安装运行f ...

  3. Python全栈之路(目录) - 含资料(持续更新)

    一. Python全栈之路 - 目录 Python基础 Python进阶 网络编程 并发编程 前端 数据库 Python Web框架之Django 前端框架之Vue Linux Flask+智能玩具 ...

  4. CSS Grid 布局完全指南(图解 Grid 详细教程)

    CSS Grid 布局是 CSS 中最强大的布局系统.与 flexbox 的一维布局系统不同,CSS Grid 布局是一个二维布局系统,也就意味着它可以同时处理列和行.通过将 CSS 规则应用于 父元 ...

  5. 前端入门14-JavaScript进阶之继承

    声明 本系列文章内容全部梳理自以下几个来源: <JavaScript权威指南> MDN web docs Github:smyhvae/web Github:goddyZhao/Trans ...

  6. 第五周课后作业——热门软件创新分析+附加题1&附加题3

    鉴于我们寝室都热衷于手游,所以本次热门软件创新分析我就来分析一下几款热门的抽卡型手游.   阴阳师(后文简称YYS)——剧情画风唯美,配音引人入胜 作为网易公司研发的一款3D日式和风回合制游戏,YYS ...

  7. Swift JSON字符串和字典以及数组的互转

    1.JSONString转换为字典 // JSONString转换为字典 func getDictionaryFromJSONString(jsonString:String) ->NSDict ...

  8. 9102 IT人保持记忆力及健康的方法

    做技术时间久了,我们会发现有的时候我们会感觉记忆力衰减太快,前脚刚忙完的事或者刚做完计划任务没多久就遗忘了,或者是以前轻车熟入的方法死活都记不起来了,亦或者之前学习一门技术很快就掌握真谛,现在即便花N ...

  9. md5sum的使用

    通过md5sum可以对文件做哈希校验,用来验证文件完整性. 批量生成校验值 $ find . -iname "*.mp4" -exec md5sum -t {} \; >/t ...

  10. 使用C++对物理网卡/虚拟网卡进行识别（包含内外网筛选）

    简介 在Socket编程的时候,我们需要实时获取我们所需要的IP地址.例如在编写后门的时候,我们可能需要获得有效的外网IP或内网IP:有时候我们可能需要判断我们获取的是否是虚拟机网卡,这时候就需要对每 ...