/* 提示信息 */
.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. Hadoop学习笔记(二)——插件安装和使用(Hadoop Eclipse)

    1. Hadoop Eclipse @ 配置 需注意 在写Hadoop的根目录时,路径不能有空格 http://blog.sina.com.cn/s/blog_56d8111101014mlg.htm ...

  2. P5522 [yLOI2019] 棠梨煎雪

    updata on 2020.3.19 今天把博客从洛谷往博客园搬,图炸了 其实早就发现了,懒得管 那图其实就是一个用dev自带的调试功能调试时,RE了的报错 当时觉得很奇怪看不出是啥,现在再看已经觉 ...

  3. 《Docker从入门到跑路》之基本用法介绍

    Docker是一种轻量级的虚拟化技术,它具备传统虚拟机无法比拟的优势,它更简易的安装和使用方式.更快的速度.服务集成和开源流程自动化. Docker的安装 安装Docker的基本要素:1.Docker ...

  4. Composition API

    介绍 Composition API的主要思想是,我们将它们定义为从新的 setup 函数返回的JavaScript变量,而不是将组件的功能(例如state.method.computed等)定义为对 ...

  5. P5343 【XR-1】分块(dp矩阵加速)

    \(大意是用数组a里的数字,组成一个序列,使得序列和为n的方案种数\)传送门 \(先考虑dp.\) \(但是不能直接用背包转移,因为是序列,要考虑顺序.\) \(所以,为了去重,我们令dp[i][j] ...

  6. V - Can you answer these queries? HDU - 4027 线段树 暴力

    V - Can you answer these queries? HDU - 4027 这个题目开始没什么思路,因为不知道要怎么去区间更新这个开根号. 然后稍微看了一下题解,因为每一个数开根号最多开 ...

  7. 设计模式之GOF23策略

    策略模式strategy 场景:对不同客户的不同报价策略 如果采用if else不易扩展,不符合开闭原则,可以采用策略模式 策略模式: 对应于解决某一个问题的算法族,允许其中一个算法去解决某一问题,同 ...

  8. [zoj3596]DP(BFS)

    题意:求n的最小倍数,满足性质P:十进制的每一位上的数有m种(0<m<=10). 思路:直接枚举n的最小倍数,然后检测是否满足性质P,n一大很容易超时,并且无法判断无解的情况.巧妙的做法是 ...

  9. Mysql 常用函数(6)- replace 函数

    Mysql常用函数的汇总,可看下面系列文章 https://www.cnblogs.com/poloyy/category/1765164.html replace 的作用 将某些字符串替换成新的字符 ...

  10. Elasticsearch系列---几个高级功能

    概要 本篇主要介绍一下搜索模板.映射模板.高亮搜索和地理位置的简单玩法. 标准搜索模板 搜索模板search tempalte高级功能之一,可以将我们的一些搜索进行模板化,使用现有模板时传入指定的参数 ...