注册 | 登录 | 网址 欢迎访问八百站长

【实训1】百度首页的制作步骤

2016/3/14 15:51:31 作者:站长日记 来源:http://www.800zz.com 浏览:2347次

一、顶端:

  1. 插入=>布局对象=>DIV标签,命名ID为top

  2. 新建CSS规则(#top),设置:高:60px、行高:60px、文本对齐:右对齐

  3. 输入文字,建立超链接

  4. 选择超链接,新建CSS规则(#top a),设置:大小:12px、粗细:粗体、颜色:黑色、(修饰:下划线)、左右边界:10px

  5. 选择超链接,新建CSS规则(#top a:hover),设置:颜色:蓝色

二、中间主体:

  1. 插入=》布局对象=》div标签,命名ID为main

  2. 新建CSS规则(#main),设置:宽:800px、高:300px、左右边界:自动、文本对齐:居中

  3. 插入图像:bd_logo.png,宽:270px、高:129px

  4. 插入=》表单=》表单,动作:http://www.baidu.com/baidu,目标:_blank

  5. 插入=》表单=》文本域,ID为wd,字符宽度:60

  6. 插入=》表单=》按钮,值修改为“百度一下”

  7. 插入=》表单=》隐藏域,名称为tn,值为baidu

三、底部:

  1. 插入=》布局对象=》DIV标签,命名ID为foot

  2. 新建CSS规则(#foot),设置:宽:800px、高:100px、左右边界:自动

  3. 插入=》布局对象=》DIV标签,命名类为left

  4. 新建CSS规则(#foot .left),设置:宽:40%、高:100px、浮动:左对齐

  5. 插入=》布局对象=》DIV标签,命名类为right

  6. 新建CSS规则(#foot .right),设置:宽:60%、高:100px、浮动:右对齐

  7. 插入=》图像,二维码,右侧段落输入文字,注意删除图像前的p标签

  8. 选择二维码图像,新建CSS规则(#foot .left img),设置:浮动:左对齐、右边界:20px

  9. 右侧输入版权信息,新建CSS规则(#foot .right p),设置:大小:14px、行高:28px、填充:0、边界:0

上一篇: 没有了 下一篇: 【原创】网页模拟题“易起贷”步骤