css实现圆角,CSS圆角实现详解
上次在群里有同学提出这样的问题，因为之前一直在用传统的Div，所以当时没能回答出来，之后经过Google了相关资料后，总结并实践了各种实现方法，现在将它写了来和大家分享一下，如果你是一个Div+Css老鸟并且已经熟练掌握，那么请直接跳过本文（您的时间一定很宝贵吧，呵呵！），如果你之前没用过并且也不会，那么请认真、耐心的看完这篇文章，我保证，你肯定能做到。以下几种方法经IE6、Ie7、Firefox... [阅读全文]
css圆角边框,完美的CSS无图片实现圆角边框效果[兼容各个浏览器]
试过了,此方法可兼容各个浏览器。效果图： 代码如下： #xsnazzy h1, #xsnazzy h2, #xsnazzy p {margin:0 10px; letter-spacing:1px;}
#xsnazzy h1 {font-size:2.5em; color:#fff;}
#xsnazzy h2 {font-size:2em;color:#06a; border:0;}
#xsn... [阅读全文]
css边框,巧用CSS边框 制作技能冷却效果
点评：下面的效果看起来还不错吧。在网页里，除了用Flash，我们还是有不少方法可以实现它。 在线演示：http://demo.jb51.net/js/2011/WarICONPrefect/index.htm上面的效果看起来还不错吧。在网页里，除了用Flash，我们还是有不少方法可以实现它。 显然这种效果不复杂，一张背景图片，加上前面带有透明度的多边形图层，在脚本控制下就可以转起来了。... [阅读全文]
css边框,巧用CSS边框 制作技能冷却效果
点评：下面的效果看起来还不错吧。在网页里，除了用Flash，我们还是有不少方法可以实现它。 在线演示：http://demo.jb51.net/js/2011/WarICONPrefect/index.htm上面的效果看起来还不错吧。在网页里，除了用Flash，我们还是有不少方法可以实现它。 显然这种效果不复杂，一张背景图片，加上前面带有透明度的多边形图层，在脚本控制下就可以转起来了。... [阅读全文]
css边框,巧用CSS边框 制作技能冷却效果
上面的效果看起来还不错吧。在网页里，除了用Flash，我们还是有不少方法可以实现它。 显然这种效果不复杂，一张背景图片，加上前面带有透明度的多边形图层，在脚本控制下就可以转起来了。但问题在于用什么方法来构建这个多边形？ 在IE下可以用VML，其他浏览器可以用Canvas等等。虽然行的通，但都不是最简单的。仔细分析下，该效果本质就是若干个三角形拼接而成。而三角形，如果你熟悉CSS2的话，一定在哪个... [阅读全文]
css圆角,CSS圆角效果,支持IE,FF,Chrome,Sa...
注：本文纯属转载
出处：http://www.oschina.net/bbs/thread/15330
先说一下Firefox的圆角属性：
-moz-border-radius: {1,4} | inherit
如果你想设置四个角都是一样圆角的话，可以像这样子直接设置-moz-border-radius:5px;
也可以单独设置元素的上左、上右、下右、下左四个角的值，分别用-moz-bo... [阅读全文]
css圆角,CSS border三角、圆角图形生成技术详解
点评：利用CSS的border属性可以生成一些图形，例如三角或是圆角。 一、前言 利用CSS的border属性可以生成一些图形，例如三角或是圆角。纯粹的CSS2的内容，没有兼容性的问题，我之前在纯CSS实现各类气球泡泡对话框效果一文中算是比较详细的讲述了CSS border属性生成三角的原理，以及实例。我觉得此技术相当实用的，故本文再次简单叙述一下，另外，本文还将展示可能并不为众人所知的CSS b... [阅读全文]
css圆角背景,CSS技巧之圆角背景与三角形实现方法
点评：前端开发中两个很不错的小技巧, CSS三角形与圆角背景. 的确, 它们都可以通过图片来实现, 但, 抛开用代码实现可以减小图片加载量不说, 当你遇到三角形或圆角背景下还有一层非纯色背景时, 你又不得不考虑IE6 png兼容问题, 嗯, IE6,万恶之源. 此时, CSS三角形及圆角背景将是上佳选择. 查看演示
!DOCTYPE HTML
html
head
meta charset... [阅读全文]
css圆角背景,CSS技巧之圆角背景与三角形实现方法
点评：前端开发中两个很不错的小技巧, CSS三角形与圆角背景. 的确, 它们都可以通过图片来实现, 但, 抛开用代码实现可以减小图片加载量不说, 当你遇到三角形或圆角背景下还有一层非纯色背景时, 你又不得不考虑IE6 png兼容问题, 嗯, IE6,万恶之源. 此时, CSS三角形及圆角背景将是上佳选择. 查看演示
!DOCTYPE HTML
html
head
meta charset... [阅读全文]
css圆角边框,兼容IE6的图片圆角边框CSS
点评：纯CSS实现的图片圆角边框效果,兼容IE6.实现原理很简单,利用绝对定位,使一个背景为PNG图片的边框覆盖在原始图片上面.而兼容IE6,本文用的是一段JS来让万恶的万万人诅咒的IE6识别PNG图片的.当然,你还可以用滤镜的方式让IE6实现PNG效果.本文后面我会附上两种解决方案.个人比较推崇用JS来实现IE6PNG,适应性比较强,但如果你只有一两处用到PNG,完全可以用滤镜的方式来实现. 核... [阅读全文]
css圆角边框,兼容IE6的图片圆角边框CSS
点评：纯CSS实现的图片圆角边框效果,兼容IE6.实现原理很简单,利用绝对定位,使一个背景为PNG图片的边框覆盖在原始图片上面.而兼容IE6,本文用的是一段JS来让万恶的万万人诅咒的IE6识别PNG图片的.当然,你还可以用滤镜的方式让IE6实现PNG效果.本文后面我会附上两种解决方案.个人比较推崇用JS来实现IE6PNG,适应性比较强,但如果你只有一两处用到PNG,完全可以用滤镜的方式来实现. 核... [阅读全文]
css圆角,魔哥css圆角实现代码 (代码精简,完全自适应)
点评：魔哥css圆角实现代码，结合了图片的实现方法，兼容性好。所用到的图片:
style type="text/css"
body,p,div {margin:0;padding:0;}
.Box {margin:10px auto;width:500px;}
/*淘宝的圆角方法*/
.R-1-T,.R-1-B {height:6px;position:relative;backgroun... [阅读全文]
css圆角,魔哥css圆角实现代码 (代码精简,完全自适应)
点评：魔哥css圆角实现代码，结合了图片的实现方法，兼容性好。所用到的图片:
style type="text/css"
body,p,div {margin:0;padding:0;}
.Box {margin:10px auto;width:500px;}
/*淘宝的圆角方法*/
.R-1-T,.R-1-B {height:6px;position:relative;backgroun... [阅读全文]
css表格边框,css 解决表格边框不显示的问题
点评：在 IE6 中，当表格单元格中的数据为空时，边框是不显示的，在IE8中是会显示的，怎样解决这个不兼容的问题呢。下面有一个例子，看如下代码，有两处不能显示，有一种解决办法是加个空格，可以解决但不是最理想的。其实只要在表格中加了一句代码就可以。 style="border-collapse: collapse" 复制代码代码如下:... [阅读全文]
css表格边框,css 解决表格边框不显示的问题
点评：在 IE6 中，当表格单元格中的数据为空时，边框是不显示的，在IE8中是会显示的，怎样解决这个不兼容的问题呢。下面有一个例子，看如下代码，有两处不能显示，有一种解决办法是加个空格，可以解决但不是最理想的。其实只要在表格中加了一句代码就可以。 style="border-collapse: collapse" 复制代码代码如下:... [阅读全文]
css圆角输入框,CSS 圆角框进行JS封装版
点评：本来前三篇文章已经将CSS圆角框讲解完毕，但从网友反馈中，都说到不好使用，因此有了这篇文章，本文主要是将前面的结果总结修订后进行JS封装，方便调用。前序：本来前三篇文章已经将CSS圆角框讲解完毕，但从网友反馈中，都说到不好使用，因此有了这篇文章，本文主要是将前面的结果总结修订后进行JS封装，方便调用。在本次封装中，增加了对真正img标签引用的图片实现圆角化，之前的圆角图片大多是基于背景图片的... [阅读全文]
css圆角输入框,CSS 圆角框进行JS封装版
点评：本来前三篇文章已经将CSS圆角框讲解完毕，但从网友反馈中，都说到不好使用，因此有了这篇文章，本文主要是将前面的结果总结修订后进行JS封装，方便调用。前序：本来前三篇文章已经将CSS圆角框讲解完毕，但从网友反馈中，都说到不好使用，因此有了这篇文章，本文主要是将前面的结果总结修订后进行JS封装，方便调用。在本次封装中，增加了对真正img标签引用的图片实现圆角化，之前的圆角图片大多是基于背景图片的... [阅读全文]
css实现圆角,百度有啊 CSS圆角实现代码
点评：百度有啊的 CSS 圆角写法，原理和《一张图片实现圆角》差不多，也是用背景定位实现的。看代码吧： XHTML 代码：复制代码代码如下:... [阅读全文]
css实现圆角,百度有啊 CSS圆角实现代码
点评：百度有啊的 CSS 圆角写法，原理和《一张图片实现圆角》差不多，也是用背景定位实现的。看代码吧： XHTML 代码：复制代码代码如下:... [阅读全文]
纯css圆角,纯css 圆角实现代码
点评：不用图片，只用css制作圆角的另一方法。html 复制代码代码如下:... [阅读全文]
纯css圆角,纯css 圆角实现代码
点评：不用图片，只用css制作圆角的另一方法。html 复制代码代码如下:... [阅读全文]
圆角名片制作教程,CSS Sprites 圆角制作教程
点评：初步介绍
当然，我知道现在有成千上万个关于 用CSS处理圆角 的教程，但不管怎么说，我仍然想把这篇文章展示给您。也希望您会发现这篇文章会非常有用。需要重点指出的是，这篇教程彻底地应用高级CSS技术，但是，我会尽力使初学者看起来简单。CSS3 在这里还没有得到完全的应用初步介绍 当然，我知道现在有成千上万个关于 用CSS处理圆角 的教程，但不管怎么说，我仍然想把这篇文章展示给您。也希望您会发... [阅读全文]
css圆角输入框,CSS实现绝对的完美圆角框
点评：网页制作Webjx文章简介：本文探讨的是圆角框的终极解决方案，其核心关键词是“圆滑、完美、兼容、重用性、语义”，这些技术都是收集目前网络上最流行的做法。纵观种种方法，各有其优势，请针对不同的环境分别使用。
导言：
本文探讨的是圆角框的终极解决方案，其核心关键词是“圆滑、完美、兼容、重用性、语义”，这些技术都... [阅读全文]
圆角名片制作教程,CSS Sprites 圆角制作教程
点评：初步介绍
当然，我知道现在有成千上万个关于 用CSS处理圆角 的教程，但不管怎么说，我仍然想把这篇文章展示给您。也希望您会发现这篇文章会非常有用。需要重点指出的是，这篇教程彻底地应用高级CSS技术，但是，我会尽力使初学者看起来简单。CSS3 在这里还没有得到完全的应用初步介绍 当然，我知道现在有成千上万个关于 用CSS处理圆角 的教程，但不管怎么说，我仍然想把这篇文章展示给您。也希望您会发... [阅读全文]
css圆角输入框,CSS实现绝对的完美圆角框
点评：网页制作Webjx文章简介：本文探讨的是圆角框的终极解决方案，其核心关键词是“圆滑、完美、兼容、重用性、语义”，这些技术都是收集目前网络上最流行的做法。纵观种种方法，各有其优势，请针对不同的环境分别使用。
导言：
本文探讨的是圆角框的终极解决方案，其核心关键词是“圆滑、完美、兼容、重用性、语义”，这些技术都... [阅读全文]
css网页实例,CSS设计网页边框的几个实例
点评：掌握CSS网页布局技术，网页边框效果的定义是基础内容，其中也涉及到CSS盒模型知识以及CSS属性简写知识。
相关文章阅读：CSS设计网页时的一些常用规范
实例一：
CSS：
p {padding: 15px; border: 1px solid black; }
h5{padding: 0px; border: 1px solid red;}
XHT掌握CSS网页布局技术，网页边框效... [阅读全文]
css边框阴影,纯CSS实现的漂亮的立体图片边框效果,阴影代码
图片立体边框效果
.image{padding:10px;border:1px solid #000;-moz-box-shadow:3px 3px 4px #000;-webkit-box-shadow:3px 3px 4px #000;box-shadow:3px 3px 4px #000;background:#fff;filter:progid:DXImageTra... [阅读全文]
css实现圆角,用CSS实现图片圆角化处理
还是先看最终效果图吧： 看到了吧，这就是用纯CSS实现的圆角化图片，为了能看到透明化的效果，我特意应用了一个背景图片，你可以下载本模型到你的电脑中，随意伸缩窗口的大小，看看外圆角是否是透明的。 有了这种效果，你再也不愁给每一张图片作圆角的工作，这种效果在一些图片类的演示页面中经常见到，特别适用那些图片比较多的列表中。怎么样，效果还可以吧！ 好了，我们来看看它的实现机制吧！... [阅读全文]
cdr圆角三角形,CSS技巧之圆角背景与三角形
前端开发中两个很不错的小技巧, CSS三角形与圆角背景. 的确, 它们都可以通过图片来实现, 但, 抛开用代码实现可以减小图片加载量不说, 当你遇到三角形或圆角背景下还有一层非纯色背景时, 你又不得不考虑IE6 png兼容问题, 嗯, IE6,万恶之源. 此时, CSS三角形及圆角背景将是上佳选择. 查看演示: 点此查看DEMO CSS圆角背景 通过改变层叠元素的margin值实现圆角效果.... [阅读全文]
css圆角:真正的圆角[CSS]
要一个宽度不固定的框，事情变得有些复杂了。宽度不固定，就意味着这个框在水平和垂直方向都有足够灵活的变化。
为什么说这更难一些呢？因为它需要对四张图片的合适安置——每个圆角用一张。每个圆角都要独立出来，以便框能够在各个方向伸展。于是，四张图片就意味着需要四个HTML对象来作为背景图片的载体。
有一些实现办法包括在样式表中使用“生成内容”，即使用：before和:after伪类来为单独的一个对... [阅读全文]
1 共1条 分1页
