HTML布局
HTML布局标签,定义文档区块,块级(block-level);定义 span,用来组合文档中的行内元素。虽然我们可以使用HTML table标签来设计出漂亮的布局,但是table标签是不建议作为布局工具使用的,设计表格的目的是呈现表格化数据 - 表格不是布局工具!
网页布局对改善网站的外观非常重要,请慎重设计您的网页布局,大多数网站会把内容安排到多个列中(就像杂志或报纸那样),大多数网站可以使用
e.g:虽然我们可以使用HTML table标签来设计出漂亮的布局,但是table标签是不建议作为布局工具使用的 - 表格不是布局工具。
HTML 布局 - 使用
1
2
3
4
5
6
7
8 Main Title of Web Page
9
10
11 Menu
12 HTML
13 CSS
14 JavaScript
15
16
17 Content goes here
18
19
20 Copyright © w3cschool.cn
21
22
23
24
25
HTML 布局 - 使用table表格
使用 HTML
1
2
3
4
5
6
7
8
Main Title of Web Page
9
10
11
12
13
14 Menu
15 HTML
16 CSS
17 JavaScript18
19
20 Content goes here
21
22
23
24
25 Copyright © w3cschool.cn
26
27
28
29
30
HTML 布局/使用 CSS 最大的好处是,如果把 CSS 代码存放到外部样式表中,那么站点会更易于维护。通过编辑单一的文件,就可以改变所有页面的布局。同时由于创建高级的布局非常耗时,使用模板是一个快速的选项。通过搜索引擎可以找到很多免费的网站模板(您可以使用这些预先构建好的网站布局,并优化它们)。
拓展:网页简单布局之结构与表现原则案例
概括:一开始我们接触网页制作的时候,就了解到html代表结构、css代表样式、javascript代表行为,网页制作中,我们一直强调结构与表现相分离的原则,这里面的结构一般指HTML,此外分离是说把它们写在不同的文件加以引用吗?当然不是,在这里的学习中了解到,分离不单是一种方法更是一种思想,简而言之,一个平面二维坐标,其中x轴代表技术发展,y轴代表网页制作需求,分离是根据技术发展和我们的网页制作需求完成的!
原文链接:https://www.cnblogs.com/dhnblog/p/12586999.html
如有疑问请与原作者联系
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有