使用before、after伪类制作三角形
使用before、after伪类实现三角形的制作，不需要再为三角形增加不必要的DOM元素，影响阅读。 <!DOCTYPE html><html><head> <style> div{ width ...
原文：理解使用before，after伪类实现小三角形气泡框
先来理解before和after伪类的用法吧，before从字面上的意思可以理解为前面的意思，它一般和content属性一起使用，把内容插入在其他元素的前面，同理after的含义就是把内容插入到其他元素的后面了。先来看一个简单的demo，如下代码： 效果如下： 简单理解完 before 和 after后，我们来看看如何使用 before 和 after来制作小三角形吧。 . 首先我们来看看 css ...
2018-11-25 11:59 0 1973 推荐指数：
相关推荐
用CSS3实现带小三角形的div框(不用图片)
用CSS3实现带小三角形的div框(不用图片) 现在看到了很多带小三角形的方框，如微信、Mac版的QQ、QQ空间的时间轴等等，在聊天或者是发表的状态的内容外面都有一个带小三角形的矩形框包围着，感觉看着很不错，于是决定亲自动手写一个，我上次用的是偏移背景图片法，那么今天就不 ...
用CSS3实现带小三角形的div框(不用图片)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/ ...
还在为小三角形切图？使用纯CSS写一个简单的三角形
同学们，当美工给的设计图是这样： 或者这样： 我的内心其实是拒绝的-_-；但工作还得干，大部分同学会写 或者干脆利落 这样做是可以解决问 ...
前端（各种demo）一：css实现三角形，css实现梯形，pop弹层，css伪类before，after使用，svg使用（持续更新中）
各种demo： 1、css实现正方形 思路：width为0；height为0；使用boder-width为正方形的边长的一半，不占任何字节；border-style为固体；border-color为正方形的填充色。 图形 2、css实现三角形 思路 ...
使用伪元素after画三角形
目录 画×图标 空心三角箭头 其他精选博客 画×图标 代码 效果 原理就是用span元素和after伪元素画两条直线，利用css3的transform属性分别进行旋转达到交叉的效果。 空心三角箭头 代码 效果 原理 ...
纯CSS3+DIV实现小三角形边框
html代码是这样的 <div class="arrow-up"> <!--向上的三角--> </div> <div class="arrow-down"> <!--向下的三角--> </div> ...
CSS画三角形以及before,after伪元素的应用。
利用css的border属性，即可实现三角形的绘制。 1,代码及效果如下 2，利用before,after伪元素以及三角形绘制实现下列图形 ...