《网页制作案例》网页设计与制作程序代码 例2
【例2-1】强制换行标记的使用 <
强制换行标记的使用</itl <h2 align= ccenter>计算机课程 <h2>程序设计<br>组成原理<br>网页制作<br>操作系统<br></div>
<div class="doc_att"><span style="float: right;"><a href="/tuan/" target="_blank">团购合买</a></span><span>资源类别：文库，文档格式：DOC，文档页数：13，文件大小：64.5KB</span></div>
</div>
<div class="doc_main_in">
<div class="doc_imgs"><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/b21170eccb.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/b21170eccb.jpg' /><p class="hidden">《网页设计与制作》程序代码 武汉大学出版社 【例2-1】强制换行标记的使用 计算机课程 程序设计组成原理网页制作操作系统 强制换段标记的使用 南登杜陵上, p>北望五陵间。 p>秋水明落日, p>流光灭远山。 ttfe文字的对齐 body> p align=e>左对齐 p align= enter>居中 右对齐 【例2-4】字体标记的使用 字体标记的使用</ttle</p><p class="hidden">《网页设计与制作》程序代码 ――武汉大学出版社 【例 2-1】强制换行标记的使用。 强制换行标记的使用 计算机课程 程序设计组成原理网页制作操作系统 【例 2-2】强制换段标记的使用。 强制换段标记的使用 南登杜陵上， 北望五陵间。 秋水明落日， 流光灭远山。 【例 2-3】文字的对齐应用。 文字的对齐 左对齐 居中 右对齐 【例 2-4】字体标记的使用。 字体标记的使用</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/0e0c1947f7.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/0e0c1947f7.jpg' /><p class="hidden">body> 文字大小的设置: font size="6">这是size=6时的字体 font size="2”>这是size=2时的字体 文字颜色的设置: font color=" black">这是黑色字体 文字字体的设置: 字体设置(楷体) font face="宋体">字体设置(宋体) 字体设置(黑体) 文字字体、大小、颜色同时使用: font size="5" color="red"face="隶书">这是sie=5,颜色为红色的隶书体文字 【例2-5】其他字体标记的使用 ttfe其他字体标记 粗体字 1>斜体字 u>加下划线 >小型字体大型字体 【例2-6】背景颜色设置 ttfe网页背景色的设置 这是 bgcolor="# CCCCCO"时的网页背景色 html 【例2-7】创建不同的有序列表 有序列表示例< title</p><p class="hidden">文字大小的设置： 这是 size=6 时的字体 这是 size=2 时的字体 文字颜色的设置： 这是黑色字体 文字字体的设置： 字体设置（楷体） 字体设置（宋体） 字体设置（黑体） 文字字体、大小、颜色同时使用： 这是 size=5,颜色为红色的隶书体文字 【例 2-5】其他字体标记的使用。 其他字体标记 粗体字 斜体字 加下划线 小型字体 大型字体 【例 2-6】背景颜色设置。 网页背景色的设置 这是 bgcolor="#CCCCCC"时的网页背景色 【例 2-7】创建不同的有序列表。 有序列表示例</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/3b2175a8c7.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/3b2175a8c7.jpg' /><p class="hidden">用大写罗马字母表示的有序列表: 列表项1<>列表项2列表项3 编号不连续的有序列表 列表项1<>列表项2列表项3 变换了数字样式的有序列表 <>列表项1<>列表项2 列表项3 【例2-8】嵌套的有序列表。 title>嵌套的有序列表 嵌套的有序列表 列表项1 子列表项1 子列表项2 子列表项3 列表项2 列表项 /html> 【例2-9】无序列表的使用。 默认的无序列表标记: 默认列表项标记 默认列表项标记二 默认列表项标记三</p><p class="hidden">用大写罗马字母表示的有序列表： 列表项 1列表项 2列表项 3 编号不连续的有序列表 列表项 1 列表项 2列表项 3 变换了数字样式的有序列表 列表项 1列表项 2列表项 3 【例 2-8】嵌套的有序列表。 嵌套的有序列表 嵌套的有序列表 列表项 1 子列表项 1 子列表项 2 子列表项 3 列表项 2 列表项 3 【例 2-9】无序列表的使用。 无序列表示例 默认的无序列表标记： 默认列表项标记一 默认列表项标记二 默认列表项标记三</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/d178ac8563.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/d178ac8563.jpg' /><p class="hidden">使用方块作为无序列表项标记: type="squa 方块列表项标记 方块列表项标记二 <>方块列表项标记三 软件说明 简单介绍软件的功能及基本应用 软件界面 用于选择软件外观 【例2-11】图像标记符的使用 body> p>显示在D盘下 photo文件夹中名为 flower. jpg的图片 【例2-12】创建表格的实例。 ttfe简单表格示例</p><p class="hidden">使用方块作为无序列表项标记： 方块列表项标记一 方块列表项标记二 方块列表项标记三 【例 2-10】定义型列表标记的使用。 定义型列表示例 定义型列表标记： 软件说明 简单介绍软件的功能及基本应用 软件界面 用于选择软件外观 【例 2-11】图像标记符的使用。 图像标记符 显示在 D 盘下 photo 文件夹中名为 flower.jpg 的图片 【例 2-12】创建表格的实例。 简单表格示例</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/fafc351a7d.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/fafc351a7d.jpg' /><p class="hidden">课程表 星期一 星期二 星期三 星期四 星期五上午 数学 语文 英语 物理 th>下午 英语 【例2-13】制作不规则表格 ttfe合并单元格示例 学生成绩表 学号 个人信息 期末成绩</p><p class="hidden">课程表 星期一 星期二 星期三 星期四 星期五 上午 数学 语文 英语 物理 哲学 下午 英语 化学 计算机 体育 【例 2-13】制作不规则表格。 合并单元格示例 学生成绩表 学号 个人信息 期末成绩</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/07dbca689c.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/07dbca689c.jpg' /><p class="hidden">td>姓名 班级入学时间数学 语文 0008郭靖 80 0009 黄蓉 100 80 caption align="top">表格1 d此表格宽为400像素,边框宽为2像素,高50像素 表格2 韩国朝鲜</p><p class="hidden">姓名 班级 入学时间 数学 语文 0008 郭靖 一年级二班 2006 年 9 月 29 80 0009 黄蓉 五年级一班 2006 年 9 月 100 80 【例 2-14】本例显示了如何影响表格宽度及单元格内和单元格间的空白。 表格尺寸设置 表格 1 此表格宽为 400 像素，边框宽为 2 像素，高 50 像素 表格 2 中国韩国朝鲜</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/b3b143a001.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/b3b143a001.jpg' /><p class="hidden">印度新加坡缅甸越南菲律宾 表格3韩国朝鲜 新加坡马来西亚缅甸越南菲律宾 【例2-15】用HIML代码实现表格设置边框和分隔线时的显示效果。 我的行程表 星期一 th>星期二 星期三 星期四 星期五 d>北京 td>黑龙江</p><p class="hidden">印度新加坡马来西亚 缅甸越南菲律宾 表格 3 中国 韩国朝鲜 印度新加坡马来西亚 缅甸越南菲律宾 【例 2-15】用 HTML 代码实现表格设置边框和分隔线时的显示效果。 表格分隔线示例 我的行程表 星期一 星期二 星期三 星期四 星期五 北京 北京 黑龙江</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/ab0ccf576a.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/ab0ccf576a.jpg' /><p class="hidden">黑龙江吉林 江苏 【例2-16】用HIML代码实现单元格内容的水平对齐 ttle表格数据的水平对齐 表格数据的水平对齐 右 右 居中 居中左左</p><p class="hidden">黑龙江 吉林 吉林 吉林 广东 广东 广东 内蒙古 内蒙古 内蒙古 江苏 江苏 【例 2-16】用 HTML 代码实现单元格内容的水平对齐。 表格数据的水平对齐 表格数据的水平对齐 本行数据右对齐 右 右 居中 本行数据为居中对齐 居中 左 左 本行数据为默认左对齐</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/83bbdf386a.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/83bbdf386a.jpg' /><p class="hidden">【例2-17】用HIML代码实现单元格内容垂直对齐的效果 表格数据的垂直对齐 表格数据的垂直对齐 aption> 上海大众 德国奔驰 valign的默认值 德国宝马 valign=bot body> 为了显示效果,为表 格添加了边框</p><p class="hidden">【例 2-17】用 HTML 代码实现单元格内容垂直对齐的效果。 表格数据的垂直对齐 表格数据的垂直对齐 上海大众 valign=top 德国奔驰 valign 的默认值 德国宝马 valign=bottom 【例 2-18】用 HTML 代码将页面划分为四个部分。 设置单元格大小 为了显示效果，为表 格添加了边框</p></div><div class="doc_img"><img class="doc_img_ss" data-src="https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/4ff7bcedff.jpg" src='https://docfiles.xiaokudang.com/upload/docimgs/21/02/20/1726/4ff7bcedff.jpg' /><p class="hidden"> 【例2-19】以下HIML代码显示了设置表格和单元格背景的效果。 ctd width="400” height="80" colspan="3" align=" center'">表格和单元格背景设 置 单元格背景色 单元格背景图案 /table> 【例2-20】框架集网页示例 ttfe框架集网页示例 html 【例2-21】以下框架集将窗口在垂直方向上分为3个框架,上下两个框架分别为80像素高 中间的框架占窗口的剩余部分 html></p><p class="hidden"> 【例 2-19】以下 HTML 代码显示了设置表格和单元格背景的效果。 设置表格和单元格的背景 表格和单元格背景设 置 单元格背景色 单元格背景图案 【例 2-20】框架集网页示例。 框架集网页示例 【例 2-21】以下框架集将窗口在垂直方向上分为 3 个框架，上下两个框架分别为 80 像素高， 中间的框架占窗口的剩余部分</p></div></div>
<div class="doc_main_foot">
<div class="doc_main_foot_down"><span id="doc_center_down" class="doc_act_down">点击进入文档下载页（DOC格式）</span></div>
<div class="doc_loadpreview doc_loadnext"><span>共13页，试读已结束，阅读完整版请下载</span></div>
</div>
</div>
</div>
<div class="doc_main_right">
<div class="doc_main_right_down doc_act_down" id="DocDown1">点击下载（DOC格式）</div>
<div class="doc_main_relate" id="DocHistory">
<style>.text_indent_unset li { text-indent: 0; }</style>
<p class="doc_main_relate_bar">浏览记录</p>
<ul class="doc_main_relate_list text_indent_unset">
<li><a href="/wenku/44286cff18444ebb96a5ba2e5f7a6e02.html" target="_blank">《网页制作案例》网页设计与制作程序代码 例2</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="doc_left"><a class="doc_act_down" title="下载文档"></a><a class="doc_act_qrcode" title="二维码"></a><a href="/wenku/a840cd5d8fbf4e05ae751698a10f4107.html" target="_blank" class="doc_act_last" title="高等教育出版社：《计算机组成原理》课程教学资源（第2版，PPT电子教案，共十章，唐朔飞）"></a><a class="doc_act_refresh" title="刷新页面"></a><a class="doc_act_top" title="返回顶部"></a></div>
<div class="page_foot" id="page_foot"><div class="foot_in f12"><a href="http://www.cucdc.com/home/aboutus.aspx" target="_blank">关于我们</a>|<a href="http://www.cucdc.com/help/" target="_blank">帮助中心</a>|<a href="http://www.cucdc.com/home/download.aspx" target="_blank">下载说明</a>|<a href="http://www.cucdc.com/home/soft.aspx" target="_blank">相关软件</a>|<a href="http://www.cucdc.com/home/feedback.aspx" target="_blank">意见反馈</a>|<a href="http://www.cucdc.com/home/contactus.aspx" target="_blank">联系我们</a><br />Copyright © 2008-现在 cucdc.com 高等教育资讯网 版权所有</div></div>
<script type="text/javascript">
var resourceId = "44286cff18444ebb96a5ba2e5f7a6e02";
var resourceToken = "72e52f94f92e40848c71fa3018dfd667";
var isPageMainVisible = true;
var isSs = ['1', '1', 'pageMain'];
document.getElementById(isSs[2]).style.display = "";
if (isSs[0] == '0' && isSs[1] == '0') {
isPageMainVisible = false;
document.title = '网页无法加载：502错误';
document.getElementById(isSs[2]).style.display = "none";
setTimeout(function () { alert('网页无法加载：502错误'); }, 1000);
}
var filePages = 13;
var pageSize = 10;
var pagerCount = 1;
var yuFilePreviewPages = 0;
var fileEndPageIndex = 10;
var currentPagerIndex = 1;
var currentUrl = 'http://download.cucdc.com/wenku/44286cff18444ebb96a5ba2e5f7a6e02.html';
//点击下载
$('.doc_act_down').bind('click', function () {
var xkdHtmlStr = downloadPanelHtml('wk', '44286cff18444ebb96a5ba2e5f7a6e02', 3.87, resourceToken);
xkdAlert('', xkdHtmlStr, null, '取消');
});
</script>
<script src="/assets/docview.js?__t=2024122309"></script>
<script type="text/javascript" src="http://www.cucdc.com/js/tongji.js?__t=20241223"></script>
</body>
</html>
<!-- 2024/12/23 9:05:48, get resource info: 63 ms; all: 65 ms; --> 