广州网站建设公司|营销型网站制作|广州二月二网站建设

广州网站建设

关注我们:

百度关键词优化排名 先排名后收费
当前位置: 首页 > 广州网站建设制作 > border-radius不仅仅是圆角

 

border-radius不仅仅是圆角

 
   发布时间:2013-01-28 15:26:23
 
 

border-radius,国内翻译成圆角,你可能以为这个属性就是用来画圆角,没错,但是除此之外,它还可以做点别的事情。广州网站制作公司为您技术篇讲解此功能应用,更多企业网站建设在这里学习代码编程吧,radius其实指的是边 框所在圆的半径,这个CSS3属性不仅能够创建圆角,还可以创建椭圆角(如图下图第7),把这些角按照不同的顺序和大小来展现,能够绘制成多种多样的图 形。以下图例就是通过定义border-radius得到的效果。 css3_border_radius_2.jpg

 

把这些基本的图形进行组合,还可以描绘成不同的图案,真的很棒。以下只是简单的几个举例,更多的图形,自己动手画吧。仅border-radius就能实现这么丰富的图案,如果再加上边框大小、渐变颜色和阴影等,将会添加更多的质感。 css3_border_radius_3.jpg

 

语法和解释 border-radius可以通过值来定义样式相同的角,也对每个角分别定义。下面的表格解释了各个写法所表示的效果。广州网站建设公司常用于下面的参数为企业网站建设提供更多个性化设计页面,所以我们的SEO优化效果做到更佳,你可以看看成功案例,里面有我们许多企业网站案例。

 

语法 解释
border-radius:10px 将创建四个大小一样的圆角,如图1和2。
border-radius:10px 15px 10px 5px; 四个值分别表示左上角、右上角、右下角、右下角。
border-radius:10px 15px; 第一个值表示左上角、右下角;第二个值表示右上角、左下角。
border-radius:10px 15px 5px; 第一个值表示左上角;第二个值表示右上角、左下角;第三个值表示右下角。
border-bottom-left-radius:20px 10px; 创建不对称的角–椭圆角。
border-radius:20px/10px; 写椭圆角的时候,可以用短写法,创建四个一样的椭圆角。
border-radius:10px 20px 30px 40px 四个值分别表示四个角的半径(水平和垂直半径一样),如图11。
border-radius:10px 20px 30px 40px/20px 50px 30px 10px; 斜杠前面的一组四个值分别表示四个角的水平半径;斜杠后面的一组四个值分别表示四个角的垂直半径。如图7。
border-radius:10px 20px 40px/20px 50px; 斜杠前面和后面每一组分别表示的是四个角水平半径和四个角垂直半径。两个值、三个值的顺序规则你懂的哈。

对于每个角的两个值,分别代表的是该角的水平方向和垂直方向的半径。若有四个值,上面表格有解释。看下面这个图,或许会清晰些。 css3_border_radius_1.jpg

 

边框大小和外半径、内半径的关系 实际的内半径相当于外半径减去相应的边框大小。相减的值中如果至少一个为为负值或零,则内半径为直角。 不管怎样,相邻的两个边都会形成流畅的线条。 css3_border_radius_4.jpg

 

应用实例 border-radius可以用来制作很生动的效果。可以点击下面的链接查看: border-radius结合Gradients、Box Shadow写的Opra Logo with CSS 兼容Firefox老的版本 为了兼容Firefox3.6及以下版本,需要写上供应商前缀,为-moz-border-radius:5px,对于每个角的语法,则为:-moz-border-radius-topleft:5px;要特别注意这与标准写法不同。转自border-radius不仅仅是圆角

 

 

SeoUeoSem企业网站建设8大功能

更多»
  •  

    基于搜索引擎优化营销型网站
    自然排名优先竞争对手

  •  

    整合所有网络营销资源
    一站式服务,打造企业级平台

  •  

    个性化企业网站设计
    让您企业网站与众不同

  •  

    会打字,就会自助建站
    全智能,即开即用

  •  

    顶级域名
    独一无二的品牌形象

  •  

    精准网络营销
    一击即中,实现高效率成交

  •  

    智能搜索引擎优化
    实现全部互联互通,优化排名

  •  

    智能CDN全球布置
    自由选择服务器,快速访问

服务与项目

广州网站制作

企业网站建站

基于网站优化SEO基础实践而开发的系统,自然排名超越竞争对手

整合网络营销

百度优化排名

百度关键词优化排名首页、先排名后收费、担保交易

在线客服软件

在线客服系统

即时网页对话,变流量为销量,抓住每一个潜在的客户

400电话

企业400号码

提升企业形象,400电话号码营销,成交更多

联系我们

客服热线:020-8844 7951
服务邮箱: info@seoueosem.com

联系在线客服

在线留言

 

如果您对我们有更多的功能需求或者建议,请到在线留言提出您的宝贵意见。