WEB前端开发经验总结1.doc_第1页
WEB前端开发经验总结1.doc_第2页
WEB前端开发经验总结1.doc_第3页
WEB前端开发经验总结1.doc_第4页
全文预览已结束

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

WEB前端开发经验总结1结构,结构,刚才我提到了标签有块级元素和行内元素之分的,要是不理解好这两个概念,我们也不会很好的了解怎么合理的结构化页面,现在就来介绍它们:块级元素块级元素生成一个元素框,(默认地)它会填充其父级元素的内容,旁边不能有其他元素。换句话说,他在元素框之前和之后生成了“分隔”符。我们最熟悉的HTML元素是p和div.行内元素行内元素在一个文本行内生成元素框,而不会打断这行文本。行内元素最好的例子就是XHTML中的a元素。strong和em也属于行内元素。这些元素不会在它本身之前或之后生成“分隔符”,所以可以出现在另一个元素的内容中,而不会破坏其显示。注意,尽管“块”和“行内”这两个词与HTML和XHTML中的块级和行内元素有很多共同点,但也存在一个重要的差别。在HTML和XHTML中,块级元素不能继承自行内元素(即不能嵌套在行内元素中)。但是CSS中,对于显示角色如何嵌套不存在任何限制。 恩,还是不能把CSS跟XHTML完全的分开谈,没办法。现在大家了解了什么是块级元素和什么是行内元素了吧。还是回过头来接着说我们的结构化吧,以上讲了这么多,我都是在讲XHTML标签要结构化,所以基本跟CSS关系不大,那么我们下面看看我写的这个页面的代码在没有CSS的情况想,是否结构清晰吧:看看,页面是不是依旧很清晰,很容易看出,哪里是标题,哪里是导航,哪里是搜索表单?呵呵,其实我这么给大家看的页面,跟我们的搜索引擎查看页面的结构很接近了,到这里大家可能体会到一些搜索引擎友好的意思了吧?其实让我们看看这个页面的DOM数状图,可能我们对一个简洁合理的结构化布局的页面有更直观的了解。看看,是不是做到了我说的:XHTML标签充分的语意化、尽量少的嵌套、页面里基本只显示用户需要看的数据、对搜索引擎友好(没有CSS支持时,浏览页面时同样清晰,层次分明,十分容易查看的数据。),已做了基本的SEO优化呵呵,说到这里我才回答了“怎样的一个页面才算是合理的布局的呢?”,做到上面4点,我个人觉得这个页面就已经做到了合理布局。而至于说要通过W3C的XHTML语法验证,只是很基础的开始。一个通过验证的页面和一个合理布局的页面是两码事的。这里我再罗嗦一下,我一直都在说的是个人认为如何才算是一个合理布局的页面?要达到什么要求才能算合理布局?因为只有理解了这个,之后的CSS的技巧(浏览器的兼容处理等)都是围绕着让XHTML页面布局更合理来进行的。而不是单纯做到各个浏览器下都显示正常(一致)。所以请记住在开发时做到:1. XHTML标签充分的语意化 2. 尽量少的嵌套 3. 页面里基本只显示用户需要看的数据(我们用CSS直接控制用户需要看的数据的显示的样式) 4. 页面对搜索引擎友好(没有CSS支持时,浏览页

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论