/* 提示信息 */
.content-tishi{
width: 6.93rem;
margin: 0 auto;
background: #e9eaea;
display: flex;
flex-direction: column;
margin-top: 0.55rem;
padding: 0.3rem 0.32rem 0.31rem 0.32rem;
border-radius: 0.1rem;
position: relative;
} .content-tishi::before{
content: "";
width: 0.0rem;
height: 0.2rem;
display: block; 三角形重点---------------------------------------
border-right:0.2rem solid transparent;
border-bottom:0.4rem solid #e9eaea;
border-left: 0.2rem solid transparent;
-------------------------------------------------------------
position: absolute;
top: -20px;
left: 20px;
}

afert和b的伪类画三角形的更多相关文章

  1. 使用before、after伪类制作三角形

    使用before.after伪类实现三角形的制作,不需要再为三角形增加不必要的DOM元素,影响阅读. <!DOCTYPE html><html><head>    ...

  2. 利用border和伪类画出三角形 ps:好久没写博客了。。。

    有一个半月没有写博客了,这段时间,小哥我经历了自入行前端最为黑暗的时期,迷茫,空虚,不想写代码,不想做研究了.连打游戏都没有兴趣,如同行尸走肉一般.还好,毕业论文的初稿完成后,整个时间段最恶心最难熬的 ...

  3. 用css伪类制作三角形的三种方法

    在手机上写三角形的时候,我一般都用伪类,刚开始的时候用的图片,但是在现在的手机高清屏幕上,图片容易失真,还是用伪类吧! 第一种:一个90度的“ > ”, 只有线条.(可以做下拉框的箭头之类的) ...

  4. :after和:before 伪类

    1 使用伪类画三角形 .div{ margin-top: 100px; margin-left: 100px; } .div:after{ content: ''; display:inline-bl ...

  5. css伪类:before及:after除了插入文字内容还能做点儿啥?画图

    全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/11181416.html 1.什么时候用伪类:before和:after? 结合实际开发情况,说一 ...

  6. css伪元素before/after和画三角形的搭配应用

    想要实现的效果如下: 第一步:如何用css画出三角形? /* css画三角形 */ .sanjiao{ ; border-top:40px solid red; border-bottom:40px ...

  7. 前端(各种demo)一:css实现三角形,css实现梯形,pop弹层,css伪类before,after使用,svg使用(持续更新中)

    各种demo: 1.css实现正方形 思路:width为0:height为0:使用boder-width为正方形的边长的一半,不占任何字节:border-style为固体:border-color为正 ...

  8. 理解使用before,after伪类实现小三角形气泡框

    先来理解before和after伪类的用法吧,before从字面上的意思可以理解为前面的意思,它一般和content属性一起使用,把内容插入在其他元素的前面,同理after的含义就是把内容插入到其他元 ...

  9. 伪类实现特殊图形,一个span加三角形

    题目如图: 实现思路: 伪类+三边透明的三角形实现 代码: <span class="wei">wei</span> .wei{ display: inli ...

随机推荐

  1. 02-线性结构3 Reversing Linked List

    02-线性结构3 Reversing Linked List   (25分) 时间限制:400ms 内存限制:64MB 代码长度限制:16kB 判题程序:系统默认 作者:陈越 单位:浙江大学 http ...

  2. 数学--数论--POJ1365——Prime Land

    Description Everybody in the Prime Land is using a prime base number system. In this system, each po ...

  3. 题目分享Y

    题意:给出一个n个点n条边的图且不一定连通(原题面为每个节点出度为1),相邻节点不能同时被选,每个节点有其对应价值,求最多能获得多少价值?n<=1e6,val[i]<=1e6 分析:很容易 ...

  4. Re模块的方法补充

    id_str = input("输入一个身份证号:") import re obj = re.compile(r"^([1-9]\d{16}[0-9x]|[1-9]\d{ ...

  5. basicRF双向灯光控制

    题目: 实现基于BasicRF无线点对点通信的双向灯光控制,具体要求如下: 1> 节点A 和节点B 的PANID设置为0x1234,通道号设置为17,节点地址自定义.<2> 按下节点 ...

  6. Spring官网阅读(十二)ApplicationContext详解(中)

    文章目录 1.Spring的资源(Resource) 接口简介 UML类图 抽象基类AbstractResource FileSystemResource AbstractFileResolvingR ...

  7. grep 如何自动标注颜色

    首先 最后一行加入 保存 然后source ~/.bashrc 然后来试一下效果

  8. python gdal 写GeoTiff文件

    1.gdal数据类型 (1)GDT_Byte(int8)  (2)GDT_UInt16 (3)GDT_Int16  (4)GDT_UInt32  (5)GDT_Int32  (6)GDT_Float3 ...

  9. vue-cli3.0读取外部化配置文件来修改公共路径

    之前我写过一篇通过nginx配置代理转发的博客,正常来说也是正确的,但不足之处在了甲方还用了F5负载均衡和gateway来代理转发.所以之前我认为的请求->nginx转发代理->后端服务, ...

  10. 使用Optional,不再头疼NPE

    前言 在 Java 语言开发中,可能大多数程序员遇到最多的异常就是 NullPointException 空指针异常了.这个当初语言的开发者"仅仅因为这样实现起来更容易"而允许空引 ...