网页设计与制作(代码介绍)
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
网页设计与制作
一、HTML 基本语言：
1.HTML 基本语法：（如图）
....:表示HTML 文档的开始和结束
…:表示HTML 文档的头部。最常用的标记是
…,
标记中的内容对应浏览窗口标题的信息。</p><p><body>…</dody>：<body>标记之内的内容对应的是浏览器中的内容。</p><p>2.<body>标记的使用：（如图）</p><p>Bgcolor="颜色":设置页面背景色。</p><p>Background="图像文件的名字及路径"：设置背景文件。 Text="颜色"：设置页面文字默认颜色。</p><p>标记属性用来对标记之间的内容修饰，标记其属性必须放到．．．．．．．．．．．．．．．．．．．．．．．．．．“．< >．．”．中，各属性间必须用．．．．．．．．．空格隔开。．．．．．</p><p>色彩的表示方法有两各种：1.RGB 模式，用16进制的红(Red)、绿(Green)、蓝(Blue)的值来表示，格式为“#RRGGBB ”，字符包括数字0～9和字母A ～F ，如红色为“#FF0000”2.用英文单词表示彩色，如红色“red ”。</p><p>二、常用的HTML 标记及其属性制作网页①：</p><p>1.页面属性、排版标志 ⑴.标题标记：</p><p>格式：<h#>...<h#>, 其中“#”的取值范国为1（字体最大）～6（字体最小）。 作用：设置文档的各级标题。</p><p>①.以下标记都出现在<body>中出现,标记必须以成对出现，如<body>...</dody>.</p><p>常见属性：align,用于定义标题的对齐方式，默认为左对齐，</p><p>标题标记属性：（如表）</p><p>⑵.版面格式标记</p><p>①.分段与换行：（如表）</p><p>可以在<p>标记中使用align属性指定文本对齐方式。另外，居中对齐可以通过居中对齐方式进行设置。</p><p>格式：<center>…<center></p><p>作用：使标记间的内容以居中对齐方式显示。</p><p>③.水平线标记</p><p>格式：<hr></p><p>作用：在文档中插入水平线。</p><p>常用水平线标记属性：（如表）</p><p>④.字体标记</p><p>格式：<font>…</font></p><p>作用：设置标记间文体的字体、大小、颜色等。</p><p>常用字体标记属性：（如表）</p><p>title设置鼠标指向文本时，出现的提示信息<font title="信息">文字内容</p><p></font></p><p>功能格式</p><p>粗体<b>...</b>或者<strong>...</strong></p><p>斜体<i>...</i></p><p>下划线<u>...</u></p><p>上标<sup>...</sup></p><p>下标<sub>...<sub></p><p>删除线<s>...</s>或者<strike>...</strike></p><p>大字体<big>...</big></p><p>小字体<small>...</small>作用：设置标记间文本的样式，如粗体、斜体、下划线等。</p><p>字体修饰标记（如表）</p><p>⑥.特殊字符</p><p>作用：在页面上显示特殊符号。</p><p>特殊字符（如表）</p><p>字符名称显示结果</p><p> 空格</p><p><<（小于号）</p><p>>>(大于号)</p><p>""(双引号)</p><p>©©</p><p>®®</p><p>××（乘号）</p><p>⑶项目符号标记</p><p>作用：在HTML页面中，合理地使用列表标记，可以起提纲和格式排序</p><p>值代表</p><p>disc实心加点（默认）</p><p>circle空心圆</p><p>square实心小方块。</p><p>无序列表的主要标记为<ul>和<li>.作用：生成没有编号的列表，每一个列表前使用<li>标签区分。（格式如右）</p><p><ul>标记的主要属性为type（如表）</p><p>注意：项目符号标记在网页中的应用比较广泛，它能清楚地标注文本的层次结构，使用户浏览网页时能对该网页的架构一目了然。其中，项目符号标记使用<ul>…</ul>时，必须是成对出现的，并且其中，项目插入多对<li>…<li>列表项标记组成完整的列表。</p><p>例：</p><p>结果图为：</p><p>2.超链接标记</p><p>格式：<a>...</a></p><p>作用：把当前位置的文本或图像连接到其他的页面、文本或图像。</p><p>属性名称属性含义示例</p><p>href 指定链接的目标地址，可以是站内</p><p>的文件，也可以某个网站</p><p><a href="a.html">...</a></p><p><a href="">...<a></p><p>target 属性</p><p>1.绝对路径：从协议开始的URL 地址或从驱动名称开始的本地文件路径都称为绝对路径。如 或d:\1\1.html</p><p>2.相对路径：从文件存储位置开始的路径叫相对路径。 在描述相对路径时，需要注意：．．．．．．．．．．．．．． ⑴．.．如果源文件和引用的文件在同一级目录里，直接写引用文件名即可。．．．．．．．．．．．．．．．．．．．．．．．．．．．．．． ⑵．.．“．...．．．/．”．表示源文件所在目录的上一级，“．．．．．．．．．．．．．．．...．．．/．...．．．/．”．表示源文件所在目录的上上级目录，以．．．．．．．．．．．．．．．．．此类推。．．．． ⑶．.．引用下级的文件，直接写下级目录文件．．．．．．．．．．．．．．．．．的路径即可。．．．．．．例．如．，．站点文件夹中有主页文件．．．．．．．．．．．index.html ．．．．．．．．．．和图像文件夹．．．．．．images ．．．．．．,index.html ．．．．．．．．．．．文件中使用了．．．．．．images ．．．．．．文件夹中的．．．．．01.jpg ．．．．．．图像文件，．．．．．那么图像．．．．01.jpg ．．．．．．相对于．．．index.html ．．．．．．．．．．的相对路径就是．．．．．．．imges ．．．．．\．01.jpg ．．．．．．</p><p>3.图像标记 格式：<img></p><p>作用：在页面中插入图像或视频文件，图像格式可以是：GIF 、JPG 、PNG 。</p>
</div>
</div>
</div>
</div>
</div>
<div id="rightcol" class="viewcol">
<div class="coltitle">相关文档</div>
<ul class="lista">
<li><a href="/doc/055816675.html" target="_blank">网页设计与制作教案</a></li>
<li><a href="/doc/0215026389.html" target="_blank">网页设计与制作讲解</a></li>
<li><a href="/doc/115484925.html" target="_blank">《网页设计与制作》课程概述</a></li>
<li><a href="/doc/2c7083313.html" target="_blank">网页设计与制作第一章概述</a></li>
<li><a href="/doc/301156124.html" target="_blank">网页设计与制作</a></li>
<li><a href="/doc/3e13468568.html" target="_blank">《网页设计与制作》课程教案设计</a></li>
<li><a href="/doc/3d15011861.html" target="_blank">个人网页设计与制作</a></li>
<li><a href="/doc/4b3305979.html" target="_blank">第1章 网页设计与制作概述2要点</a></li>
<li><a href="/doc/6d18521246.html" target="_blank">网页设计与制作(选修课)</a></li>
<li><a href="/doc/6818873710.html" target="_blank">第1章 网页设计与制作概述</a></li>
</ul>
<div class="coltitle">最新文档</div>
<ul class="lista">
<li><a href="/doc/071000073.html" target="_blank">饭店包间名字大全</a></li>
<li><a href="/doc/0d10001030.html" target="_blank">word无法创建工作文件,请检查临时环境变量</a></li>
<li><a href="/doc/0d10001458.html" target="_blank">自行车健身比赛开幕式讲话词</a></li>
<li><a href="/doc/0510001469.html" target="_blank">2018乡村医生个人工作总结</a></li>
<li><a href="/doc/0e10002558.html" target="_blank">MySQL测试题 SQL</a></li>
<li><a href="/doc/0310002568.html" target="_blank">合勤NXC5200</a></li>
<li><a href="/doc/0210004833.html" target="_blank">铁路集中箱空箱调度优化建模案例(案例2)</a></li>
<li><a href="/doc/021000530.html" target="_blank">微分几何教学大纲-复旦大学数学科学学院</a></li>
<li><a href="/doc/031000596.html" target="_blank">人教版九年级数学上册导学案：24.1.1_圆【精品】</a></li>
<li><a href="/doc/0c10006773.html" target="_blank">(整容后办护照用)医院整容证明</a></li>
<li><a href="/doc/0e10006860.html" target="_blank">危险废物管理台账</a></li>
<li><a href="/doc/0310008420.html" target="_blank">2017年终大会会场物料设计方案</a></li>
</ul>
</div>
</div>
<script>
var sdocid = "7bf1fb1aba4cf7ec4afe04a1b0717fd5370cb2f0";
var docId = '7bf1fb1aba4cf7ec4afe04a1b0717fd5370cb2f0';
var totalPage = 8;
const ext = 'doc';
const pageNum = '8';
</script>
<script src="https://assets.360docs.net/pc/js/render.js"></script>
<div class="clearfloat"></div>
<div id="footer">
<div class="ft_info">
<a href="https://beian.miit.gov.cn">闽ICP备16038512号-3</a> <a href="/tousu.html" target="_blank">侵权投诉</a> ©2013-2023 360文档中心,www.360docs.net | <a target="_blank" href="/sitemap.html">站点地图</a><br />
本站资源均为网友上传分享，本站仅负责收集和整理，有任何问题请在对应网页下方投诉通道反馈
</div>
<script type="text/javascript">foot()</script>
</div>
</body>
</html> 
