如何让IE7,IE8支持border-radius

galilajiao00

2014-12-08

用过border-radius的人都应该知道，这个属性的兼容性，如果你不知道，也没关系，看看下面的图就知道了。
如何让IE7,IE8支持border-radius
实现兼容性非常简单，在meta里加下面这段代码就支持了。

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

原理：在用ie浏览时，使用chrome内核，如果没有安装chrome，则使用支持的最高版本的ie内核，所以看起来好像是支持圆角了，其实是假装的……

如果，你的电脑只有ie6,ie7,ie8,还有一种办法，就是使用待圆角图片做背景(这个就不做详细介绍了)。

eg:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

<title>test圆角</title>
</head>

<body>
<div style="border-radius:10px; width:200px; height:200px; background:#888;">
</div>
</body>
</html>

border-radius meta 谷歌浏览器

galilajiao00

0 关注 0 粉丝 0 动态

相关推荐

jQuery实现日历效果

jquery是用的是2.0版本。--基于W3C标准不用做任何修改-->. --设置初始化文档信息和文档管理标注-->. --整个页面编码 utf-8 国际编码通用性最强，GBK/gb2312 中文-->. .signincalenda

momode 2020-09-11

你知道我们平时在CSS中写的%都是相对于谁吗？

在我们编写css的时候，经常会用到百分比赋值（%）实现自适应。像我们最常使用的流式布局设计模式，基本所有的column的宽度都是通过%来取值的。或者比如经常会遇到的元素水平垂直居中问题，我们常常会使用下面这样的css代码加以实现：。line-height：

云端漂移 2020-07-06

巧妙实现带圆角的渐变边框

border-image是 CSS 规范CSS Backgrounds and Borders Module Level 3 新增的一个属性值。顾名思义，我们可以给 border 元素添加 image，类似于background-image，可以是图片也可

MaureenChen 2020-02-17

滚动条样式

::-webkit-scrollbar{width:6px;height:16px;} ::-webkit-scrollbar-track-piece{background-color: #f3f3f3;-webkit-border-radi

bertzhang 2020-01-31

CSS3(1)---圆角边框、边框阴影

CSS3可以简单理解成是CSS的增强版，它的优点在于不仅有利于开发与维护，还能提高网站的性能。圆角在实际开放过程中，还是蛮常见的。以前基本是通过背景图片做的，有了CSS3后可以使用简单的属性搞定，可以通过border-radius设置元素的圆角半径。bor

impress 2020-01-11

css——设置圆角border-radius值为50%安卓各版本会变形

刚开始审查元素时发现border超出，以为是这个问题。后来参考文章后发现是单位问题。.cirlce.active { 　　border: 1px solid #fd6001; 　　background: #fd6001;}

MaureenChen 2020-01-10

0025 CSS属性书写顺序

文本属性：color / font / text-decoration / text-align / vertical-align / white- space / break-word

impress 2019-12-31

css画百分比圆环

border-radius: 44px 0 0 44px/44px 0 0 44px;border-radius: 50px 0 0 50px/50px 0 0 50px;当剩余量大于50%时左侧上叠加环形旋转角度不用变，只有计算右测上叠加环形旋转角度即可

zhanghao 2019-12-20

CSS3圆角

表中的数字指定完全支持该属性的第一个浏览器版本。数字后面的 -webkit- 或者 -moz- 使用时需要指定前缀。在CSS3中，可以使用border-radius属性，为元素指定圆角显示。如果只为border-radius属性指定一个值，则此半径将应用于

zengni 2019-12-18

CSS3(1)---圆角边框、边框阴影

CSS3可以简单理解成是CSS的增强版，它的优点在于不仅有利于开发与维护，还能提高网站的性能。圆角在实际开放过程中，还是蛮常见的。以前基本是通过背景图片做的，有了CSS3后可以使用简单的属性搞定，可以通过border-radius设置元素的圆角半径。bor

zhanghao 2019-12-12

记录移动端开发1像素边框问题， stylus代码转成less

改成less 语法，对照less官方文档，写入 mixin.less文件，引用除了语法的不同，变量定义、方法的调用外，改了一处。问题解决，下班走人！

didianmanong 2019-11-17

纯css实现开关效果

我们使用<input type="checkbox">标签来实现这个效果。checkbox的选中、未选中的特性，刚好对应开关的打开、关闭on:打开 off:关闭。这里要讲解一下，使用了position来实现的定位。有不了解的

impress 2019-11-05

CSS3 边框

通过 CSS3，您能够创建圆角边框，向矩形添加阴影，使用图片来绘制边框 - 并且不需使用设计软件，比如 PhotoShop。您将学到以下边框属性：border-radius、box-shadow、border-image。IE9+、Firefox 4+、C

MaureenChen 2019-11-03

DIV 自定义滚动条样式（二）

流浏览器自带的滚动条样式很丑，确实有必要美化。滚动条从外观来看是由两部分组成：1，可以滑动的部分，我们叫它滑块2，滚动条的轨道，即滑块的轨道，一般来说滑块的颜色比轨道的颜色深。而且不同的浏览器下，CSS 滚动条属性的写法也不一样，如果各个浏览器都需要兼容，

echoes 2019-11-03

前端面试每日 3+1 —— 第199天

[css] border-radius:50%和border-radius:100%有什么区别？[js] ajax的请求状态有哪几种？[软技能] 假设有一个场景，需要前端自己计算十万级别或更多的数据，你有解决什么方案呢？《论语》，曾子曰：“吾日三省吾身”。

zhangruiweb 2019-11-01

在安卓手机中rem单位border-radius:50%画圆变形的解决方案

};使用border-radius:50%,或者border-radius的值与宽高相等，都可实现一个完美的圆形，但是在不同的安卓手机中，会有不同程度的变形；当使用px做为宽高的单位，border-radius:50%画出来的圆是不会变形的；但使用rem时

绿豆饼 2019-10-20

-webkit-scrollbar 滚动条样式美化

-webkit-scrollbar修改滚动条样式,包括背景颜色，大小，形状等等。

xtuhcy 2014-11-12

通过父元素加css 类

a.detail_link { background-color: #7ccef3; padding: 5px 15px; color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px;

Phoebe的学习天地 2015-11-12

你可能不知道的一些css小知识

css是一门功能强大、具备完整生态的复杂语言。它拥有很多的技巧，但是生活工作中我们可能不怎么会接触到，这包括一些实际上挺实用的技巧。在此，特地列举一些css里比较容被忽略的小知识，希望能对你有所帮助。跟圆形的实现一样，这里也是用到border-radiu

王景迁 2019-09-07

CSS 使用图片作为4个角边框

父及元素定位方式position: relative;四个角的图片定位为position: absolute;-webkit-border-image:url 30 30 round; /* Safari 5 */

懵懂听风雨 2018-09-27

galilajiao00

W3CSchool教程: HTML 教程; CSS 教程; Bootstrap 教程; Javascript 教程; jQuery 教程

后端教程: C 教程; Java 教程; PHP 教程; Python 教程; Go 教程

移动开发: Android 教程; Swift 教程; Kotlin 教程; jQuery Mobile 教程; ionic 教程

关于我们: 新闻动态; 联系方式; 招聘英才; 安科实验室; 帮助与反馈

安科网(Ancii)，中国第一极客网

Copyright © 2013 - 2019 Ancii.com

京ICP备18063983号京公网安备11010802014868号