/* 提示信息 */
.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. 全网最清晰的ConstraintLayout教程

    ConstraintLayout是AndroidStudio2.2新增的一个功能,那么这个到底是什么呢?首先第一点我们知道传统的安卓开发,页面基本都是XML编写实现,特别在一些复杂的页面上需要嵌套多层 ...

  2. Java 线程池(ThreadPoolExecutor)原理分析与实际运用

    在我们的开发中"池"的概念并不罕见,有数据库连接池.线程池.对象池.常量池等等.下面我们主要针对线程池来一步一步揭开线程池的面纱. 有关java线程技术文章还可以推荐阅读:< ...

  3. 使用JXL.jar实现JAVA对EXCEL的读写操作

    简介: jxl.jar是通过java操作excel表格的工具类库 jxl操作excel包括对象Workbook(工作簿),Sheet(工作表) ,Cell(单元格). 一个excel就对应一个Work ...

  4. CF1316C Primitive Primes

    CF1316C [Primitive Primes] 给出两个多项式\(a_0+a_1x+a_2x^2+\dots +a_{n-1}x^{n-1}\)和\(b_0+b_1x+b_2x^2+ \dots ...

  5. 使用Python+TensorFlow2构建基于卷积神经网络(CNN)的ECG心电信号识别分类(二)

    心律失常数据库 目前,国际上公认的标准数据库包含四个,分别为美国麻省理工学院提供的MIT-BIH(Massachusetts Institute of Technology-Beth Israel H ...

  6. Codeforces Round #632 (Div. 2)

    Codeforces Round #632 (Div. 2) 这一场打的好差呀,这几次艰难上的分全部掉回去了,感觉就像一夜回到了解放前. 说实话,就是被B卡到了,没看到只能从小的放到大的... Lit ...

  7. spring boot中使用AJAX请求,并将回调函数赋值给input输入框

    HTML: <script>/* $(document).ready(function(){} 页面加载事件,加载完页面之后执行 */ $(document).ready(function ...

  8. 【BIM】BIMFACE中实现电梯实时动效

    背景 在运维场景中,电梯作为运维环节重要的一部分是不可获缺的,如果能够在三维场景中,将逼真的电梯效果,包括外观.运行状态等表现出来,无疑是产品的一大亮点.本文将从无到有介绍如何在bimface中实现逼 ...

  9. 设计模式之GOF23备忘录模式

    备忘录模式Memento 场景: -Word文档编辑时,电脑死机或者断电,再次打开时,word提醒恢复之前的文档 -文件的撤回 核心: -就是保存某个对象内部状态的拷贝,这样以后就可以将该对象恢复到原 ...

  10. flink批处理从0到1学习

    一.DataSet API之Data Sources(消费者之数据源) 介绍: flink提供了大量的已经实现好的source方法,你也可以自定义source 通过实现sourceFunction接口 ...