`
85273898
  • 浏览: 4993 次
  • 性别: Icon_minigender_1
  • 来自: 上海
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

HTML笔记之兼容所有浏览器的CSS3圆角

阅读更多
首先导入<script src="js/curvycorners.js"></script>
这个JS google一下就可以搜索到!
样式别忘记了哦哈哈!

<style>
#solution {
    -moz-border-radius: 0 12px 12px 12px;
    background:#b60000;
    display: block;
    float: left;
    height: 238px;
    overflow: hidden;
    padding: 22px 24px 0;
    width: 177px;

    color:#FFF;
    font-weight:bold;
    font-family:Microsoft YaHei;
}
</style>


<div id="solution">上海37℃</div>
分享到:
评论

相关推荐

    html笔记,html5+css思维导图

    2. **CSS3新特性**:渐变,阴影,圆角,动画和过渡效果等提升视觉体验。 3. **响应式Web设计**:利用`viewport`元标签和媒体查询,使HTML5页面适应不同设备。 4. **Web组件**:HTML5的`&lt;template&gt;`,`&lt;slot&gt;`和`...

    jQuery学习笔记之jQuery+CSS3的浏览器兼容性

    从IE7的CSS2支持到现代浏览器的CSS3完全兼容,前端开发人员需要了解并处理这些问题,以确保网页在不同浏览器中都能良好展示。通过使用jQuery等JavaScript库和采取相应的兼容性策略,开发者可以更高效地解决兼容性...

    CSS3笔记1

    为了兼容旧版本浏览器,各大浏览器厂商(如Chrome、Safari、Firefox等)会在CSS3属性前添加特定的前缀,例如`-webkit-`、`-moz-`、`-ms-`等。这使得开发者可以逐步引入新特性,而不会在不支持这些特性的浏览器中...

    CSS笔记全面手册

    1. 使用前缀(如 `-webkit-`、`-moz-`、`-ms-`、`-o-`)确保CSS3新特性在不同浏览器上的兼容。 2. **Can I Use**网站提供了CSS特性在各种浏览器中的支持情况,有助于了解兼容性问题。 综上所述,CSS是构建美观、...

    《CSS3》学习笔记大全

    "CSS3 学习笔记大全" CSS3 是当前 Web 开发中最重要的样式表语言之一,它能够使得网页变得更加炫酷,之前需要用 JavaScript 才能...但是,我们也需要注意 CSS3 的浏览器兼容性问题,以免在不同的浏览器中出现问题。

    Html+css3详细笔记

    这份"Html+css3详细笔记"无疑是学习这两门技术的重要参考资料。以下将详细阐述HTML5和CSS3的关键知识点。 HTML5是超文本标记语言(HyperText Markup Language)的第五个版本,它对原有的HTML4进行了大量的改进和...

    curvycorners js+css 圆角矩形, 没有使用图片.

    在网页设计中,创建圆角矩形的效果通常需要借助图像或者特定的CSS3属性来实现。然而,"curvycorners js+css"是一个独特的解决方案,它允许开发者在不使用图片的情况下创建具有圆角的矩形元素。这个技术由国外开发者...

    html-css-note.rar_html 前端

    7. **浏览器兼容性**:学习如何处理不同浏览器之间的差异,使用前缀和特性检测确保代码的广泛兼容。 8. **网页美化**:CSS中的背景、边框、圆角、阴影等效果,以及如何使用渐变、径向渐变和多重背景。 9. **...

    CSS3 3D立体逼真的粉色蛋糕特效.rar

    最后,为了适应不同设备和浏览器,我们需要考虑CSS3的兼容性问题。一些老版本的浏览器可能不支持3D转换,这时可以借助Modernizr等库检测浏览器特性,或者提供回退方案,使用2D转换或者图片来呈现效果。 总结来说,...

    纯CSS3黑白钢琴键盘特效.zip

    首先,CSS3中的`transform`属性是这个特效的核心之一。通过变换功能,可以对元素进行旋转、缩放、平移等操作,模拟钢琴键的按下和弹起状态。例如,当用户触发某个键时,可以通过改变`transform`属性来使该键向下移动...

    可爱的熊猫图形CSS3特效.zip

    jQuery库通常与CSS3结合使用,以处理浏览器兼容性和更复杂的交互逻辑。虽然"可爱的熊猫图形CSS3特效.zip"主要关注CSS3,但可能也包含jQuery代码,用于辅助实现某些效果,比如动态响应用户操作,或者在页面加载完成后...

    HTML学习笔记_zhr1226.rar

    HTML的学习笔记可能还包括了对浏览器兼容性的理解,因为不同的浏览器可能会有不同的解析规则,开发者需要知道如何编写兼容性良好的代码。此外,版本迭代中的HTML5和HTML5.1的新特性,以及未来的HTML标准发展趋势也是...

    css样式 的笔记AAAAAAAAAAAA

    - `font-family`设置字体,通常包含多个备选字体以确保跨浏览器兼容性。 - `color`定义文本颜色,可以使用颜色名称、十六进制、RGB或RGBA等格式。 - `text-decoration`添加下划线或其他装饰,`text-shadow`创建...

    CSS3卡通复古路灯图形特效.zip

    在描述中提到的“非常实用的特效代码”,意味着这个压缩包包含了一段可以直接应用到网页中的CSS3代码,该代码已经经过测试,能够正常工作并且兼容多种浏览器。同时,“可以完美运行,可以二次修改!”意味着不仅可以...

    纯CSS3下拉菜单导航.rar

    CSS3还提供了阴影效果(`box-shadow`)、圆角(`border-radius`)和渐变(`linear-gradient`)等功能,使菜单看起来更加专业和美观。 在实际应用中,开发者可能会遇到一些挑战,比如在响应式设计中调整下拉菜单的...

    CSS3立体咖啡杯图形特效.zip

    虽然CSS3特性在现代浏览器中广泛支持,但仍然需要考虑老版本浏览器的兼容性。可以使用Modernizr这样的库来检测浏览器特性,并提供降级方案。此外,过多的3D特效可能会影响页面性能,因此应适度使用,并优化关键帧...

    12种风格的CSS3垂直导航菜单栏.rar

    7. **CSS3兼容性**:虽然CSS3提供了许多强大的功能,但其在不同浏览器上的兼容性各不相同,因此在实际应用中,可能需要借助前缀(如`-webkit-`,`-moz-`)或者JavaScript库(如jQuery)来确保跨浏览器的兼容性。...

    CSS3左上角页面卷曲悬停特效.zip

    【标题】"CSS3左上角页面卷曲悬停特效.zip"所涉及的知识点主要集中在CSS3的新特性、网页交互效果以及与JavaScript和jQuery的配合使用上。下面将详细阐述这些技术及其应用。 1. CSS3新特性: - `transform`属性:...

Global site tag (gtag.js) - Google Analytics