网页设计笔记

时间：2023-09-28 09:36:01 | 来源：网站运营

时间：2023-09-28 09:36:01 来源：网站运营

网页设计笔记： 网页布局

第三部分（主体）




外层表格：

1、插入表格——1行3列 1000 0 0 0 居中对齐

2、列宽：1列 250像素 3 200像素

行高不设







内层（左边嵌套）

1、光标定位第一个单元格中

2、插入表格——2行1列 100% 0 0 0

3、第一行行高：40像素

第二行行高：150像素




4、表格间距设置成1 边框设置成0

5、表格的背景颜色

代码中添加：bgcolor

6、设置单元格的背景颜色




7、选中嵌套表格——复制ctrl+c——单击键盘上向右箭头——ctrl+v

8、在外层第三个单元格内——垂直——顶端——ctrl+v




内层（中间嵌套）

1、光标定位在中间单元格——垂直 顶端 水平 居中

2、插入表格——2行1列 96% 0 0 0

3、第一行拆分单元格 3列

4、列宽：第一列 20% 第3列 10%

5、行高：第一行 45像素 第二行 200像素

6、输入文字




第四部分（版权）

1、插入表格——1行1列 1000像素 0 0 0 居中对齐

2、设置行高 60像素

3、设置背景颜色 水平 居中对齐

4、输入文字







欧妮雅网站首页：

1、插入表格：1行5列 1000像素 0 0 0 居中对齐

2、列宽 1列 25像素 2列 126像素 3列 136像素 4列 669像素

行高：58像素

3、在第2、4列分别插入图片：main_02







主体外层

1、插入表格——1行7列 1000像素 0 0 0 居中对齐

2、列宽：1列 39像素 2列 311像素 3列 44像素

4列 252像素 5列 48像素 6列 247像素 7列不设

行高不设




左侧嵌套

1、光标定位在外层表格的第二列内

2、插入表格——4行1列 100% 0 0 0

3、在第1、3、4行分别插入图片：main_10、main_21、main_27




中间嵌套

1、光标定位在外层表格的第四列内

2、插入表格——4行1列 100% 0 0 0

3、在第2、3行分别插入图片：main_13、main_20




如果嵌套表格垂直方向居中，

需要设置该嵌套表格所在的单元格垂直顶端对齐




选中嵌套的表格——点击键盘上向右的箭头——属性栏中设置垂直 顶端对齐




右侧嵌套

1、光标定位在外层表格的第六列内——垂直 顶端对齐

2、插入表格——6行1列 100% 0 0 0

3、在2——5行内分别插入图片：main_16、main_24、main_30、main_33




选择外层所有的单元——设置背景颜色 紫色




第四部分（版权信息）

1、插入表格——1行4列 1000像素 0 0 0 居中对齐

2、列宽 1列 25像素 2列 126像素 3列 200像素

行高 70像素

3、在第2、4单元格——插入图片main_38、main_40