设为首页加入收藏业务一览表公司历程公司介绍联系我们
当前位置网站建设知识 >> 网站设计之超圆滑圆角框的半完善解决计划

网站设计之超圆滑圆角框的半完善解决计划

圆角框,由于其样式比直角框美丽,所以成为网页设计师心中偏爱的设计元素。现在的web尺度下大批的网页、博客都采用圆角框设计,成为一道亮丽的风景线。然而,就是这个圆角,却成为了网页前端职员心中永远抹之不往的暗影,对它,可以说是又痛又爱。爱的是它的美丽,痛的是要让它兼容通行于各种不同的浏览器却成为一个永远的神话。

  让我们往返顾一下目前网站建设中都有哪些解决计划。

  第一种:无图片纯css圆角框

  收录理由:兼容性强,不用图形

超圆滑圆角框的半完善解决计划
图一 

  特点:
  1. 不用任何图形,应用很多个div容器模仿出圆角后果。
  2. 兼容性:通杀所有浏览器。

  毛病:
  1. 结构这个圆角需要参加太多的无语义的标签,结构比拟冗余。
  2. 重用性不强:假如一个页面有多个圆角,并且要实现不同的半径大小,则其机动性不够。
  3. 边框色彩固然可以调节,但会对页面中的结构产生致命的影响,实用于色彩单一并且一个页面中圆角利用未几的页面。
  4. 不轻易实现圆弧内有渐变色的图形背景。
  5. 圆角框不够圆滑,有锯齿现象,合适于背风景和当前色色差不大并且圆弧较小的网页。
  实现原理:
  用很多1像素高的div容器,利用背风景和边框色来模仿出圆角框的轮廓线。

[来源:互联网] [作者:c36] [日期:10-07-05] [阅读:]