`
lmh2072005
  • 浏览: 113832 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

关于圆角的问题,谁有更好的方式?

阅读更多

现在越来越多的网站喜欢上了圆角,css3 可以很轻松的实现 ,可是IE6\7\8不支持,又不想用图片和多标签实现 ,很纠结。

       网上看了很多相关的文章,比较出名的实现方式有用 border-radius.htc 和DD_roundies  可是这两个方法还是存在许多不足和bug。

      用border-radius.htc 实现 则该元素或父标签要有position:relative和zindex 。为了实现个圆角加上这个真的很没必要。而且必须是4个圆角都有,没法实现只有1个、2个、3个圆角。样式和htc文件路径也是个问题,要么同目录要么样式里面用绝对路径。

     DD_roundies 还稍微好些,但是bug也很明显 ,页面初始化调用DD_roundies.addRule('.className', '2px', false)后,如果窗口再resize的话 生成的圆角框好像fiexed掉了页面布局乱了。还有隐藏显示的问题,隐藏元素后发现生成的圆角框不能隐藏还依然在那。

     border-radius.htc  : http://www.htmlremix.com/css/curved-corner-border-radius-cross-browser

     dd_roundies         : http://www.dillerdesign.com/experiment/DD_roundies/

 

    IE6\7\8下面有没有更好的方式去实现呢?还在探索...

 

add:

 

网上一位同学提醒了用PIEhttp://css3pie.com/  这个比起上面两个确实要好些 不过当父标签有背景颜色或背景图的时候就会失效,好像被父标签的背景档住了,这时要在目的标签加上relative就好了 

分享到:
评论

相关推荐

    有关RHINO曲面圆角教程,倒圆角的高级用法

    8. **实例应用**:通过实例练习,用户可以更好地理解和掌握这些高级圆角用法,例如在汽车设计、工业产品造型、建筑设计等领域。 【文件名称列表】:“圆角教程” 这个压缩包中的“圆角教程”可能包含了视频教程、...

    div css圆角代码各种圆角表格_圆角边框css圆角

    在网页设计中,`div` 和 `CSS` 是不可或缺的部分,尤其当涉及到界面美观和用户体验时,圆角设计显得尤为重要。...在不断变化的网页设计领域,熟练运用这些技巧能帮助我们更好地满足用户对美观和功能的需求。

    div圆角代码 非常简单的圆角代码

    使用HTML的特殊字符`•`来创建圆角,这种方法的圆角更平滑,但仍然需要无语义标签,结构冗余,颜色调整有限,也不易实现渐变背景。适合对圆角平滑度有一定要求,但颜色需求简单的页面。 3. **图片圆角框**: 这是...

    圆角PopupWindow对话框和圆角EditText

    为了更好地理解上述过程,查看和理解源码至关重要。在阅读源码时,你需要关注如何设置背景,以及如何处理边角的绘制。例如,在自定义的PopupWindow或者EditText中,你可以看到如何设置Paint对象的cornerRadius属性,...

    易语言Exdui无锯齿自定义圆角图片框

    这个模块的独特之处在于其利用了Gdip(即GDI+,图形设备接口的增强版)的纹理画刷功能,来实现圆角效果,并确保图片在显示时没有锯齿,从而提供更好的视觉体验。 GDI+是Windows操作系统中用于图形处理的一个强大...

    listview圆角列表demo

    而RecyclerView作为ListView的替代品,提供了更好的性能和更多的自定义选项,同样可以实现圆角效果。 7. **性能优化**: 在处理大量数据时,要注意避免内存泄漏和性能问题。使用convertView复用机制可以提高ListView...

    Glide加载圆形图片 自定义圆角 和对指定角加载圆角

    在一些设计中,我们可能需要将图片显示为圆形或者具有特定圆角的效果,以达到更好的视觉体验。本篇将详细介绍如何使用Glide实现这一功能。 首先,我们来理解“Glide加载圆形图片”。Glide通过自定义转换器...

    圆角的实现方式,CSS+JS

    另外,一些库如jQuery Corner或Rounded Corners lite提供更方便的API来实现圆角效果,但它们可能对性能有一定影响,特别是在大量元素上应用时。 总结来说,实现圆角效果主要依赖CSS3的`border-radius`属性,对于老...

    把bitmap处理成圆角

    实现Bitmap到圆角的转换主要有两种方法: 1. **图形变换**:通过Canvas的drawARGB()或drawBitmap()方法,结合Matrix进行图像的裁剪和旋转,以达到圆角的效果。这种方法相对复杂,需要精确计算每个像素的位置,对...

    我的圆角样式

    标题“我的圆角样式”可能指的是一个关于...总之,“我的圆角样式”这个主题涵盖了前端开发中关于圆角样式的基础知识和实践技巧,通过深入学习和实践,可以提升你的CSS技能,更好地服务于网页和应用程序的界面设计。

    vml实现圆角表格

    通过阅读和理解这个文本文件,你可以更好地掌握如何在不支持CSS3的环境中使用VML创建具有圆角的表格。 总结来说,VML提供了一种在老版IE浏览器中实现圆角图形的方法,尤其是对于圆角表格的创建。虽然现代浏览器已经...

    关于圆角的简单做法效果(Html)

    在这些情况下,CSS3的`border-radius`属性通常是更好的选择,因为它能直接在元素上设置圆角,且兼容性好。然而,对于简单的需求和不支持`border-radius`的旧浏览器,这个相对定位和绝对定位的方法仍然是一种实用的...

    AI 圆角插件

    在设计领域,Adobe Illustrator(简称AI)是一款广泛使用的矢量图形编辑工具,尤其在创建标志(Logo)和其他需要精准线条和形状的...通过熟练掌握并运用这款插件,设计师可以更好地实现他们的创意,让作品更加出色。

    Java 圆角边框实例

    在Java编程中,创建具有圆角边框的界面可以提升应用程序...在压缩包中的"Demo"文件可能包含了这个实例的完整代码,你可以参考并运行它来更好地理解这一过程。记得根据实际情况导入相应的包,并确保Java环境已经配置好。

    自定义圆角的dialog

    在Android应用开发中,Dialog是一种重要...自定义Dialog不仅可以提高应用的视觉效果,还能更好地适应各种业务场景,提升用户体验。在实际开发中,开发者可以根据项目的具体需求,灵活地调整和扩展自定义Dialog的功能。

    Android-RoundRectLayout圆角矩形的绘制方案解决任意圆角和圆形图片

    在Android应用开发中,UI设计往往...通过理解其工作原理和使用方法,开发者可以更好地实现个性化和高质量的用户界面。在实际项目中,结合性能优化和兼容性处理,`RoundRectLayout`可以成为提升应用视觉效果的有力工具。

    圆角框的制作

    这个资源可能包含了一些示例代码、教程或案例,可以帮助你更好地理解和应用CSS圆角框的设计技巧。通过不断练习和实验,你将能够熟练掌握圆角框的制作,并在网页设计中创造出各种独特而美观的效果。 总之,CSS圆角框...

    圆角Listview

    通过以上步骤,我们可以成功地创建一个具有圆角效果的ListView,使其在UI设计中更加突出,提供更好的用户体验。在实际开发中,可以根据具体需求进行调整,比如改变圆角的大小、颜色,或者添加其他视觉元素。

Global site tag (gtag.js) - Google Analytics