昨天写的一个页面,用的css3及html5的一些样式与标签,在ie8下看是没有效果的,然后就在晚上查找了一下如何能让ie8也能实现这些效果。

1.添加respond.js文件,Respond.js让IE6-8支持CSS3 Media Query。

2.实现html5的标签:html5shiv.js文件,让IE(包括IE6)支持HTML5元素

respond.js和html5shiv.js的在线地址:

<!-[if IE]>
<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<![endif]->
<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>

3.在ie8(6,7)下实现css3的圆角和隐形效果,添加ie-css3.htc文件,ie-css3的使用方法很简单,在你需要使用css3的样式里加入behavior: url(js/ie-css3.htc);就可以了

<div id="box_2"></div>

<div id="box_3">
<h1>文字效果</h1>
<p class="test">This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>
</div> #box_2 {
border:#A2BFE0 solid 5px;
width:100%;
height:500px;
border-radius:10px;
behavior: url(http://fetchak.com/ie-css3/ie-css3.htc);
background:#fff;
box-shadow: 10px 10px 5px #888888;
} #box_3 {
border: #A2BFE0 solid 5px;
width: 100%;
height: 500px;
border-radius: 10px;
behavior: url(http://fetchak.com/ie-css3/ie-css3.htc);
background: #fff;
box-shadow: 10px 10px 5px #888888;
} #box_3 h1 {
text-shadow: 5px 5px 5px #FF0000;
behavior: url(http://fetchak.com/ie-css3/ie-css3.htc);
} p.test {
width:11em;
border:1px solid #000000;
word-wrap:break-word;
behavior: url(http://fetchak.com/ie-css3/ie-css3.htc); //ie-css3.htc的路径
}

 都可以看到圆角。并且有阴影效果。

但是:1.如果想对图片进行圆角设置,只能是将图片变成背景图片展示。2.阴影颜色不能控制,显示的是默认的黑色,

某位大牛还说是要在该标签上添加position:relative(absolute),及z-index确保该标签在最上边。

让ie678支持css一些属性及html标签的更多相关文章

  1. IE6不支持CSS的属性选择器

    input[type="text"] { width: 50px; } 测试IE6不生效,而IE7以上浏览器则没问题

  2. JavaScript CSS Style属性对照表

    JavaScript CSS Style属性对照表 盒子标签和属性对照 CSS语法 (不区分大小写) JavaScript语法 (区分大小写) border border border-bottom ...

  3. CSS Content 属性

    content 属性,用在after,before伪元素上,用于在选中的元素前后插入内容. 插入的内容多种多样, 纯文字 h1::after{ content:"h1后插入内容" ...

  4. IE6支持兼容min-width、max-width CSS样式属性

    IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...

  5. Flexible 弹性盒子模型之CSS flex-basis 属性

    实例 设置第二个弹性盒元素的初始长度为 80 像素: div:nth-of-type(2){flex-basis:80px;}   效果预览 浏览器支持 表格中的数字表示支持该属性的第一个浏览器的版本 ...

  6. Flexible 弹性盒子模型之CSS flex-shrink 属性

    实例 让第二个元素收缩到其他元素的三分之一: 效果预览 div:nth-of-type(2){flex-shrink:3;} 浏览器支持 表格中的数字表示支持该属性的第一个浏览器的版本号. 紧跟在 - ...

  7. Flexible 弹性盒子模型之CSS flex-grow 属性

    实例 让第二个元素的宽度为其他元素的三倍: div:nth-of-type(1){flex-grow:1;} div:nth-of-type(2){flex-grow:3;} div:nth-of-t ...

  8. css之属性部分

    这篇写的是今天的学习到的属性,一共20个. 属性再多,但也要会使用,会在使用时可以记起它,才能起到它为我们所需要的作用. 样式属性 1.border CSS边框属性允许你指定一个元素边框的样式和颜色. ...

  9. 解决IE6不支持position:fixed属性

    最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性.上网收集了一下解决方案 比较好的方案就是利用css表达式进行解决 补充:CSS Expression (CSS 表达式), ...

随机推荐

  1. web后门top

    看到了一个博客  觉得关键点很有用 1)出现频率最高的DDoS后门文件名 abc.php, xl.php, Xml.php, dedetag.class.php, counti.php, plase. ...

  2. JAVA GUI设计中遇到的一个小问题

    最近新学,大牛勿喷.. 写下笔记主要是记录自己常犯的错误,也方便新人解决问题学习参考. 问题:win7下设计GUI,文本框和密码框显示不出来. 我的解决方案: 1. JTextField text = ...

  3. 购买vps创建账号后无法登录ftp

    购买了vps,并在后台已经开通了ftp账号,但是前台无法登录.错误提示530.解决方法是: 请检查您ftp账号密码是否输入正确,若确认正确,请您ssh登陆服务器,然后执行sh /www/wdlinux ...

  4. ubuntu安装miniconda

    系统:ubuntu15.04   64位 wget -c http://repo.continuum.io/miniconda/Miniconda-latest-Linux-x86_64.sh chm ...

  5. 将文件读取到内存、打印pe结构

    #include <stdio.h> #include <malloc.h> #include <stdlib.h> #include <string.h&g ...

  6. SecureCRT显示中文和语法高亮

    因为默认情况下,SecureCRT不能显示语法高亮特性,整个界面颜色单一,看起来不爽,也没有效率,所有通过设置一下语法高亮还是很有必要的, 默认字体也看着不是很清晰,还是更改为我比较喜欢的Courie ...

  7. URLConnection 使用

    统一资源定位符URL(Uniform Resource Locator)是www客户机访问Internet时用来标识资源的名字和地址.超文本链路由统一资源定位符URL维持.URL的格式是: <M ...

  8. 事件冒泡与事件委托 -Tom

    事件冒泡 事件冒泡,就是事件触发的时候通过DOM向上冒泡,首先要知道不是所有的事件都有冒泡.事件在一个目标元素上触发的时候,该事件将触发祖先节点元素,直到最顶层的元素: 如图所示,如果a连接被点击,触 ...

  9. phpmailer发送邮件 SMTP Error: Could not authenticate 错误

    这个错误说明虚拟主机不支持PHPMailer默认调用的fsockopen函数,找到class.smtp.php文件,搜索fsockopen,就找到了这样一段代码: $this->smtp_con ...

  10. python中if __name__ == '__main__'

    python 中__name__ = '__main__' 的作用,到底干嘛的? 有句话经典的概括了这段代码的意义: “Make a script both importable and execut ...