网页设计与制作(代码介绍)
- 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="图像文件的名字及路径"：设置背景文件。</p><p>Text="颜色"：设置页面文字默认颜色。</p><p>标记属性用来对标记之间的内容修饰，标记其属性必须放到</p><p>．．．．．．．．．</p><p>．．”．中，各属性间必须用．．．．．．．．．．．．．．．．．．．．．．．．．．“．< ></p><p>空格隔开。</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>⑴.标题标记：</p><p>格式：<h#>...<h#>, 其中“#”的取值范国为1（字体最大）～6（字体最小）。</p><p>作用：设置文档的各级标题。</p><p>常见属性：align,用于定义标题的对齐方式，默认为左对齐，</p><p>①.以下标记都出现在<body>中出现,标记必须以成对出现，如<body>...</dody>.</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>⑤.字体修饰标记</p><p>作用：设置标记间文本的样式，如粗体、斜体、下划线等。</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>作用：在HTML页面中，合理地使用列表标记，可以起提纲和格式排序</p><p>文作用。列表分为无序列表和有序列表两类</p><p>无序列表的主要标记为<ul>和<li>.作用：生成没有编号的列表，每一个</p><p>列表前使用<li>标签区分。（格式如右）</p><p><ul>标记的主要属性为type（如表）</p><p>值代表</p><p>disc 实心加点（默认）</p><p>circle 空心圆</p><p>square 实心小方块。</p><p>注意：项目符号标记在网页中的应用比较广泛，它能清楚地标注文本的层次结构，使用户浏览网页时能对该网页的架构一目了然。其中，项目符号标记使用<ul>…</ul>时，必须是成对出现的，并且其中，项目插入多对<li>…<li>列表项标记组成完整的列表。</p><p>例：</p><p>结果图为：</p><p>2.超链接标记</p><p>格式：<a>...</a></p><p>作用：把当前位置的文本或图像连接到其他的页面、文本或图像。</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>窗口的名称，也可以是_blank、</p><p>_parent、_self、_top,默认为_self</p><p><a href="a.html" target="_blank”...</a></p><p>title 鼠标指向链接时，所显示的信息<a href="a.html" title="信息"...</a></p><p>网络资源，也可以是本地计算机上的文件资源。HTML有两种路径：绝对路径与相对路径。</p><p>1.绝对路径：从协议开始的URL地址或从驱动名称开始的本地文件路径都称为绝对路</p><p>径。如或d:\1\1.html</p><p>2.相对路径：从文件存储位置开始的路径叫相对路径。</p><p>在描述相对路径时，需要注意：</p><p>．．．．．．．．．．．．．．</p><p>⑴．.．如果源文件和引用的文件在同一级目录里，直接写引用文件名即可。</p><p>．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．</p><p>⑵．.．“．...．．．/．”．表示源文件所在目录的上一级，“</p><p>．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．...．．．/．...．．．/．”．表示源文件所在目录的上上级目录，以此</p><p>类推。</p><p>．．．</p><p>⑶．.．引用下级的文件，直接写下级目录文件</p><p>．．．．．．．．．．．</p><p>．．．．．．例．如．，．站点文件夹中有主页文件．．．．．．．．．．．．．．．．．的路径即可。</p><p>index.html</p><p>．．．．．．图像文件，</p><p>．．．．．01.jpg</p><p>．．．．．</p><p>．．．．．．文件夹中的</p><p>．．．．．．images</p><p>．．．．．．images</p><p>．．．．．．,index.html</p><p>．．．．．．．．．．和图像文件夹</p><p>．．．．．．．．．．．文件中使用了</p><p>那么图像</p><p>．．．．．．．imges</p><p>．．．．．．</p><p>．．．．．\．01.jpg</p><p>．．．．．．．．．．的相对路径就是</p><p>．．．．01.jpg</p><p>．．．．．．相对于</p><p>．．．index.html</p><p>3.图像标记</p><p>格式：<img></p><p>作用：在页面中插入图像或视频文件，图像格式可以是：GIF、JPG、PNG。</p><p>①表格的几种标记</p><p>作用表格是最基本的网页布局的技术</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 did = "87864018";
var ext = 'doc';
var docId = '041cko07g3v5gs50mk5b';
var totalPage = 8;
const pageNum = '8';
</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>foot()</script>
</div>
</body>
</html> 