讲一些对于页面布局以及html的理解
来源:互联网 发布:2014十大网络用语 编辑:程序博客网 时间:2024/05/22 11:43
html元素有很多 什么时候 该用什么元素 其实很有讲究 :
一般页面布局 都 是div css 我们需要 去理解每个元素的语义化 做到就算网络延迟没有加载到css 也能让用户一目了然的明白整个网页的布局
比如 一个网页中 h1标签 只能出现一次 我的理解 它 其实和head里面的title一样 代表 这个网页的主题 其他如strong B标签 h(1,2,3...)标签 加重显示效果 一般放在一些显眼一段文字的标题上
而div呢 放在一个块里面 看到一个网页原型图的时候 就要在脑海中开始布局 怎么分块 怎么布局 对兼容性有很大的帮助 布局布的好做网页的兼容其实不难ie6其实也很容易兼容的。除非是浏览器本身的某些bug 比如ie6不支持position fixed 这个 也是能够 兼容的
p 是一个段落 一小段文字 可以放在p标签内 注意 p是块标签 会占整个块的 所以布局的时候 如果这段文字占了父标签的100% 那么 就用p 不然就用span span是行内标签
打个比方 :
我 觉得 csdn 这里 应该用h3 或者一些显示的标题 让别人知道 这个是标题
而文章标题 那一块应该用strong 因为strong本身的语义 就是 强调文本 加粗的
而下面那一段话 用一个p标签也行 这里为读这个文章列表用了太多的div了 div 嵌套太多 影响加载速度 影响代码质量
我觉得 这个本来就是一个文章列表 列表形式的 用一个ul li 再里面套 一个 strong p 下面那一行再用一个p 都 可以完成
他这里嵌套了5 ,6层div 哪有这种 写法 太不会布局(个人见解哈 不知道 用什么做例子)
再讲一个例子:
这种 情况 应该用什么布局 会比较好 : 鼻部 鼻炎 鼻出血 鼻甲肥大 这种 布局
他是用的 div ul li a
这里 他没有凸显出标题 没有突出中心点 我觉得应该用dl dt dd 会好些
html 是这么解释的
定义和用法
<dl> 标签定义了定义列表(definition list)。
<dl> 标签用于结合 <dt> (定义列表中的项目)和 <dd> (描述列表中的项目)。
我觉得dl 这个布局 就是有一个中心点<dt> 其他 <dd> 都是围绕着这个中心点的属性 布局 一定要用html 标签本身的语义化 然后 排版 该怎么显示 就用css 来控制 局布好了 css控制 好了 一般兼容性的问题也就不存在了 浏览器本身的bug除外
其实兼容性 是取决于 html css 布的好不好 有的浏览器有显示有的浏览器有问题 这个很大一部份 都归纠于浏览器的容错能力 如果在别的浏览器有问题 那就是你布局 和css 写的不好 有提升的空间
html5 就更加强调标签的语义化
比如:
<section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。
还有浏览器的头部 底部 都有各自相应的标签 当然还有一些其他新出的标签
总之 html5 就更加强调标签的语义化
布局和css用的好 很屏蔽很多兼容性的问题
- 讲一些对于页面布局以及html的理解
- 讲一些对于css 的理解
- html对页面布局的初步理解
- 菜鸟程序员对于html页面布局的疑问
- 对于宽字节注入字符的一些问题以及理解
- 对于线程的一些理解
- 对于工程师的一些理解
- 对于gbdt的一些理解
- 对于hive的一些理解
- 对于用户上传不规划Html而导致页面布局错乱的一简单解决方法
- Java:对于Borderlayout布局管理的理解
- 对于html页面的重置问题
- 对于html页面历史记录的控制
- printf("%d,%d",b++,++b); 对于printf的一些理解,以及前++后++
- 对于HTML CSS JS的理解
- 对于asp.net 页面模型的理解
- MVC页面布局的理解
- 对于文章页面优化的一些看法
- hihoCoder175
- IT第一定律——Moore ‘s law
- 父进程利用fork()函数创建子进程并且利用shared_memory进行通信的实例
- 关于12864如何显示八行的问题
- NYOJ 19
- 讲一些对于页面布局以及html的理解
- LeetCode Two Sum时间复杂度O(n)解法尝试版本1
- listener.ora
- js模板引擎artTemplate快速上手
- 第26章 站在巨人肩膀上——游戏引擎技术导论
- maven项目导入:Failed to read candidate component class: file
- 最近有朋友问我 什么平台的BTC 可以用FIX API 平台不错的请推荐谢谢
- Python数据可视化(matplotlib库)
- React click toggle