HTML5网站建设中由aside和section的工具栏

发布时间:2014-12-4 8:06:27

HTML5网站建设中由aside和section的工具栏

  由aside及section组成的工具栏
  aside元素作用于页面上一些与主题联系不大而相对独立的区域。在示例里,我们在页面右边创建了一个典型的侧边栏,宁波网站建设认为它包括3个部分:问卷调査、登录和快速链接。快速链接列表使用了nav元素,另外两个区块则嵌人到一个叫section的新元素里。
  section元素作用于同一主题下不同的文档部分,例如论文各章节或是表单页面中的独立表格。若section出现在页脚,它通常作用于附录、目录、许可协议等。一般来说,在有内容的表格中使用section也是可以的。在这里,问卷调查以及登录都由section标注,而链接部分则如前所述,用nav标注。
  
  跟前面提到的页脚中的nav—样,侧栏的问卷调査部分上面也有一个h2元素,通过CSS的display:none隐藏。侧边栏格式为float:right,宽度width:20%,字体font-size:
  em。圆形右下角是侧边栏的一个显著特点,它意味着这个HTML5博客使用了CSS3:圆角是这里用到的两个特性之一。经典的圆形右下角CSS语法如下:
  .rounded-bottom-right{
  -moz-border-radius:OpxOpx20pxOpx;
  -webkit-border-radius:OpxOpx20pxOpx;
  1border-radius:OpxOpx20pxOpx;
  另一个特性是4个区域的细微阴影,它们在CSS文档中定义如下:
  .shadow{
  -moz-box-shadow:4pxOpxlOpx-3pxsilver;-webkit-box-shadow:4pxOpxlOpx-Bpxsilver;1box-shadow:4pxOpxlOpx-3pxsilver;鉴于CSS3还没有进入候选推荐(candidaterecommendation)阶段,CSS语句还需要使用-moz-和-webkit前缀,来对不同的浏览器提供兼容支持。可以肯定的是,在CSS3进入标准化流程后,边框半径(border-radius)以及盒阴影(box-shadow)也是不会有所变化的。不过在那之前,还是得暂时容忍这些前缀以及在不同浏览器下表现出的些微差别。
  本文由乐华网络编辑,转载请注明出处
  宁波网站建设www.leseo.net
上一篇:
页面的CARP准则啥是CARP即是指Contrast、Alignment、Repetition、Pr
下一篇:
假如公司只进行搜索引擎优化,就只会带来流量,这个流量能不能转换成赢利就有必要靠网站优化与搜索引擎推行
关于乐华
乐华介绍
乐华思维
人才招聘
使用条款
隐私保护
RSS订阅
网站地图
新闻动态
乐华观点
行业动态
频道介绍
服务介绍
案例展示
品牌研究
品牌理论
品牌体系
联系我们
400-680-2900
社会媒体
微信公众平台
微信公众平台