博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
合理利用HTML标记优化网页布局
阅读量:4036 次
发布时间:2019-05-24

本文共 1054 字,大约阅读时间需要 3 分钟。

我们一直在讲CSS网页布局代码的优化,在以往的文章中,也一直强调语义和文档的结构。随着国外对WEB标准的推广,有些新手认为,web2.0就是把以前的table布局都改为DIV+CSS布局就是web2.0。其实不然, 我们要合理利用这些标签。 有一点值得引起注意,那就是在 web 开发人员圈子里通常被称为“div-itis”的对 div 元素的滥用现象。
 
  通过大量的嵌套 div 或 span 元素来添加样式确实很方便,但还是应尽量避免这种诱惑。在多数情况下,为文档内现有元素附加样式或 JavaScript 功能是可以做到不必引入 div 或 span 元素的。作为通用容器的 div 或 span 元素应作为最后的手段使用——也就是说,最好是先尽量以语义化元素来编写网页,仅在确实需要时才加入通用容器元素。

  所以我们要:优化 优化 再优化 精简和优化CSS网页布局代码

  我要多用一些语义性标签,但是也要对号入座,标签语义要用对。

 
  HTML元素的语义类别

  结构

  这些元素的语义定义了他们在文档中扮演着的结构的角色

div

span
ol,ul,li,dl,dt,dd
del,ins
h1..h6
p

  内容
  这些元素的语义定义了在文档中表示内容标记的语义

a

abbr
acronym
address
blockquote
cite
code
dfn
kbd
q
samp
var

  修饰形容

  这些元素起到对内容的修饰和形容

strong

em

" Once you've completed your markup, go over it two more times and find ways to reduce the number of elements on the page. Does that UL really need its own wrapping div? I think not. "

  注意您的样式表

  当我们的网页内容做得很多的时候,样式表文件的代码也随着庞大和臃肿起来。
  我们也慢慢感觉到,有些地方不合理或重复定义。
  这就是你对CSS选择符应用上出现问题了,灵活使用这些CSS选择符是使用CSS控制网页的基础,CSS选择符也是CSS学习的重点和难点。
  我们是否应在设计的开始应该合理应用这些CSS选择符那?
  关于CSS选择符的分类,使用,定义,由于内容之大我就不说了,一些关于CSS样式表的优化技巧的文章学习一下

转载地址:http://blcdi.baihongyu.com/

你可能感兴趣的文章
python单元测试unittest学习
查看>>
Errors running builder 'Validation' on project 'jumi_3.0'
查看>>
SpringMVC学习笔记
查看>>
springMVC如何接收前端传递的数组数据
查看>>
查看当前占用端口、关闭当前端口所暂用的进程
查看>>
Eclipse中有用的快捷键
查看>>
mysql将表字段信息拼接转换成实体类中的属性书写格式
查看>>
有return的情况下try catch finally的执行顺序
查看>>
input文本框中value值有双引号的问题
查看>>
java多线程简介
查看>>
web.xml配置加载顺序
查看>>
ServletContextListener使用详解
查看>>
UrlRewriteFilter使用说明
查看>>
java对redis的基本操作
查看>>
Java Math的 floor,round和ceil的使用
查看>>
通过url方式传递中文乱码解决办法
查看>>
Java的初始化机制、垃圾回收机制和内存分配机制
查看>>
MySQL5.6安装步骤(windows7/8_64位)
查看>>
FreeMarker基础配置
查看>>
Java中使用Jedis操作Redis
查看>>