分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

css3 各版本浏览器兼容

发布时间:2023-09-06 01:37责任编辑:彭小芳关键词:浏览器

前缀

浏览器

-webkit

chrome和safari

-moz

firefox

-ms

IE

-o

opera

上图是各大浏览器的兼容

圆角效果:border-radius;阴影效果:box-shadow; ??例: box-shadow:4px 2px 6px #f00, -4px -2px 6px #000 , 0px 0px 12px 5px #33CC00 inset;边框图片: border-image:url("http://img.mukewang.com/52e22a1c0001406e03040221.jpg")15 round;
半透明背景:background-color:rgba(255,255,255,0.5);
渐变色彩: ?线性渐变 - ?background-image:linear-gradient(to top left,#fff,#999); ?????????径向渐变 - ?background-image:radial-gradient(circle, #f00, #ff0, #080);
文本溢出省略号: text-overflow:ellipsis; (clip:为剪切) ?????????????overflow:hidden; ?????????????white-space:nowrap;

文本是否换行: word-wrap:normal | break-word;

嵌入字体: @font-face {
??????????????????????font-family: 字体名称;
??????????????????????src: 字体文件在服务器上的相对或绝对路径;
????????????????????}

文本阴影:  text-shadow: 2px 2px 0 red;

背景: ?设置背景图片的原始起始位置 - ?background-origin: border-box | padding-box | content-box;(必须是repeat)
??????裁剪背景 - ?background-clip : border - box;
??????背景大小 - ?background-size: auto | 长度值 | 百分比 | cover | contain;
??????组合写法 - ?background: url() no-repeat right bottom /150px 70px;

css3 各版本浏览器兼容

原文地址:https://www.cnblogs.com/panlaixing/p/8318442.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved