css 制作三角形图标 不支持IE6
.triangle {
width: 10px;
height: 10px;
overflow: hidden;
border-left: 4px solid rgba(, , , );
border-right: 4px solid rgb(, , );
border-top: 4px solid #ff0;
border-bottom: 4px solid #ca0309;
}
效果:
把10px改成0后:
去掉border-top这一句:
把border-left和border-right弄透明:
修改后的代码:
.triangle {
width: ;
height: ;
overflow: hidden;
border-left: 4px solid rgba(, , , );
border-right: 4px solid rgba(, , , );
border-bottom: 4px solid #ca0309;
}
css 制作三角形图标 不支持IE6的更多相关文章
- CSS制作三角形和按钮
CSS制作三角形和按钮 用上一篇博文中关于边框样式的知识点,能制作出三角形和按钮. 我先说如何制作三角形吧,相信大家在平时逛网站的时候都会看到一些导航栏中的三角形吧,比如说: 网易首页的头部菜单栏中, ...
- CSS 制作三角形原理剖析
使用css制作三角形其实原理很简单,下面一步步解析. 1.html代码如下 <div class="triangle"> </div> 2.CSS代码 .t ...
- 用css制作三角形
用css制作三角形,主要是利用css元素给“盒模型”设置边框得到的. 上图,上边框和做边框,以及上边框和右边框的交合处,浏览器会按照直角的二分之一处绘制交合线.这是“盒模型”有宽和高时候的效果.我们假 ...
- CSS实现三角形图标原理解析
CSS实现三角形图标原理解析: border边框语法: border 四条边框设置border-left 设置左边框,一般单独设置左边框样式使用border-right 设置右边框,一般单独设置右边框 ...
- css制作三角形,下拉框三角形
网站制作中常常需要下拉框,而如果下拉框如果只是单纯的矩形则会显得太过单调,所以这次教大家利用css制作三角形放在矩形上面 首先利用css制作三角形 div { width:0px; height:0p ...
- 纯CSS制作网页图标
三角形 <div class="box"></div> <style>.box{ width: 0; height: 0; border-top ...
- 经典CSS实现三角形图标原理解析
前言: 在写这篇文章之前,我也看过很多前端大神写的代码,But,都只是粘贴代码和给出显示效果,对于初学者来说大家都喜欢刨根问底,为什么要这样做呢? 接下来就让我给大家分享一下我对CSS实现三角形的理解 ...
- CSS实现三角形图标的原理《转载》
网页中经常有一种三角形的图标,鼠标点一下会弹出一个下拉菜单之类的(之前淘宝也有,不过现在改版好像没有了) 之前以为是个png图标背景,后来在bootstrap中看到有一个图标样式叫做caret的用来实 ...
- CSS实现三角形图标的原理!!!!今天总算弄懂了。
网页中经常有一种三角形的图标,鼠标点一下会弹出一个下拉菜单之类的(之前淘宝也有,不过现在改版好像没有了) 之前以为是个png图标背景,后来在bootstrap中看到有一个图标样式叫做caret的用来实 ...
随机推荐
- 【试水CAS-4.0.3】第01节_CAS服务端搭建及导入源代码到MyEclipse
完整版见https://jadyer.github.io/2015/07/16/sso-cas-server-demo/ /** * @see ---------------------------- ...
- Php取扩展名
Php取扩展名 /** * 取扩展名 */ function getext($url){ $base = parse_url($url); $name = basename($base['path'] ...
- 计算机文件基本上分为二种:二进制文件和 ASCII(也称纯文本文件)
文本文件是可以看到的字符, 二进制文件是不可视字符,如图片. 二进制文件: 包含在 ASCII及扩展 ASCII 字符中编写的数据或程序指令的文件.计算机文件基本上分为二种:二进制文件和 ASCII( ...
- ORA-01400: 无法将 NULL 插入 ("CHARGE_WQRL"."SF_JMQTFY_T"."BH")
[ERROR] JmCheckManageDaoImpl:901 - java.sql.SQLException: ORA-01400: 无法将 NULL 插入 ("CHARGE_WQRL& ...
- FAT AP v200R005 配置二层透明模式(web&命令行,开局)
背景: vlan123:用户业务vlan,192.168.1.0/24 Vlan2001:管理vlan,172.168.129.0/24 vlan1:默认vlan,不建议使用. 注意事项: 配置服务集 ...
- HTML-HTML5+CSS3权威指南阅读(二、让IE支持HTML5标签及对CSS3 Media Query的兼容)
兼容解决 HTML5是在低版本的浏览器(IE8-)的兼容是有限的,类似很多结构性的标 签<header>.<section>.<footer>等在IE8以下不会被识 ...
- 在go中使用leveldb --levi
github上有个比较好用的leveldb go wrapperlevigo, 安装之前需现在机器上安装leveldb 当前版本的LevelDB没有带安装脚本,需自行编译安装,过程如下: instal ...
- jqplot使用小心得
这两天做一个项目,需要画饼图,所以在网上搜到jqplot这个插件.下面就说说我对他的简单的使用心得. 先说说我想要的效果:1.我需要修改饼图每个部分的背景色 2.我需要修改饼图里面文本的颜色和字体大小 ...
- 关于JSP和HTML
工作中,发现非常多同事不清楚JSP与HTML的生命周期.以至于出现"JavaScript为啥不能调用JSTL标签(或EL表达式)?"的笑话问题. 以下以流程图的方式.简单说明一下过 ...
- zookeeper(一):功能和原理
简介 ZooKeeper 是一个开源的分布式协调服务,由雅虎创建,是 Google Chubby 的开源实现.分布式应用程序可以基于 ZooKeeper 实现诸如数据发布/订阅.负载均衡.命名服务.分 ...