网页设计与开发实验课件第2章 HTML基础介绍_第1页
网页设计与开发实验课件第2章 HTML基础介绍_第2页
网页设计与开发实验课件第2章 HTML基础介绍_第3页
网页设计与开发实验课件第2章 HTML基础介绍_第4页
网页设计与开发实验课件第2章 HTML基础介绍_第5页
已阅读5页，还剩17页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

主要内容了解HTML文档的基本结构了解标记属性的使用方法和规则2.1HTML文档结构一个完整的HTML文件包含头部和主体两个部分的内容，在头部内容里，可定义标题、样式等，文档的主体内容就是要显示的信息。<!--程序2-1--><html><head><title>一个简单的HTML示例</title></head><body><h1>欢迎光临我的主页</h1></body></html>2.1.2头部内容<head>…</head>HTML文档的头部标记,在浏览器窗口中，头部信息是不被显示在正文中的，在此标记中可以插入其它用以说明文件的标题和一些公共属性的标记。head部分允许的标记根据HTML标准，仅有<base>,<link>,<meta>,<title>,<style>和<script>几个标签在HTML的头部分是合法的。Title如要指定HTML文档的网页标题（它将显示在浏览器窗口顶部标题栏），就要在头部内容中提供有关信息。用title元素来指定网页标题，即在<title></title>之间写上网页标题，如程序2-2。2.1.2头部内容<!--程序2-2--><html><head>

<title>我的第一个网站</title></head><body></body></html>2.1.2头部内容2.1.2头部内容<META>元素可提供有关页面的元信息（meta-information），META标签分两大部分：HTTP标题信息(HTTP-EQUIV)和页面描述信息(NAME)。例如加入关键字会自动被大型搜索网站自动搜集；可以设定页面格式及刷新等等。这些定义的内容并不在网页页面中显示。但他们会有一些特殊的作用。＜head＞

<metahttp-equiv="content-Type"content="text/html;charset=gb2312"><metaname="Keywords"content="教育,就业,计算机">

<metaname="Description"content="教育,就业,计算机">＜/head＞2.1.2头部内容META的属性content：定义与http-equiv或name属性相关的元信息http-equiv：把content属性关联到HTTP头部，取值范围包括：content-type，expires，refresh，set-cookiename：把content属性关联到一个名称。取值范围：author、description、keywords、generator、Robots等http-equiv属性使用带有http-equiv属性的<meta>标签时，服务器将把名称/值对添加到发送给浏览器的内容头部。例如，添加：＜head＞<metahttp-equiv="charset"content=“text/html;charset=gb2312"><metahttp-equiv="expires"content="31Dec2011">＜/head＞content-type:text/htmlcharset:gb2312expires:31Dec20112.1.3主体内容在标记<body>和</body>中放置的是页面中所有的内容，如图片、文字、表格、表单、超链接等元素。例如，程序2-4在body部分添加了几个关于文本和段落的标记。

2.1.3主体内容<!--程序2-4--><html><head><title>我的第一个页面</title></head><body><h1>这里是文章的标题。</h1><p>这里是文章的段落。</p></body></html>2.1.4编写网页的开头可以通过浏览器直接查看一个页面的HTML源代码，例如在IE浏览器菜单栏上选择“查看

源文件”即可。大多页面的开头，通常使用DOCTYPE标记来声明要使用什么风格的HTML或XHTML。DOCTYPE使浏览器知道应该如何处理文档，并且让验证器知道按照什么样的标准检查代码的语法。然后，用html标记标出实际代码的起始位置。2.2HTML基本语法HTML用于描述功能的符号称为“标记”。<html>、<head>、<body>等都是标记。标记通常分为单标记和双标记两种类型。2.2.1标记语法单标记单标记仅单独使用就可以表达完整的意思。基本语法：<标记名称>语法说明：最常用的单标记是<br>,它表示换行。2.2.1标记语法

双标记双标记由首标记和尾标记两部分构成，它必须成对使用。首标记告诉Web浏览器从此处开始执行该标记所表示的功能。尾标记告诉Web浏览器在这里结束该标记。基本语法：<标记名称>内容</标记名称>语法说明：其中“内容”部分就是要被这对标记施加作用的部分。例如，“b“标记的作用是，告诉浏览器介于标记<b>和</b>之间的文本应以粗体显示。（这里的“b”是“粗体（bold）”的意思。标记可以包含标记，即标记可以成对嵌套，但是不能交叉地嵌套。下面的代码就是错误的：<B><I>这是错误的交叉嵌套代码</B></I>。2.2.2属性语法HTML通过标记告诉浏览器如何展示网页，如<br>告诉浏览器显示一个换行。另外还可以为某些元素附加一些信息，这些附加信息被称为属性（attribute）。例如，标记<hr>的作用是在网页中插入一条水平线,那么这条水平线的粗细、对齐方式等就是该标记的属性，如：

<hrsize="5px"align="center">2.2.2属性语法基本语法：<标记名称属性名1="属性值"属性名2="属性值">语法说明：属性应写在首标记内，并且和标记名之间有一个空格分隔。例如，上例中hr标记中，align为属性，center为属性值，属性值可以直接书写，也可以使用""括起来。以下写法也是正确的：

<hrsize=5pxalign=center>2.3注释注释标签用于在HTML源码中插入注释。注释会被浏览器忽略。可以使用注释对程序代码进行解释，适当的注释对以后代码的阅读和维护产生很大的帮助。基本语法：

<!--注释内容-->语法说明：左括号后需要写一个惊叹号，右括号前就不需要了。

<hrsize=5pxalign=center>

2.4编写HTML文件的注意事项“<”和“>”是任何标记的开始和结束。元素的标记要用这对尖括号括起来，并且结束的标记总是在开始的标记前加一个斜杠“/”；元素必须被关闭。标记可以嵌套使用，但不能嵌套标记。任何回车符和空格在HTML代码中都不起作用。为了代码清晰，建议不同的标记都单独占一行；标记中可以放置各种属性，属性值都用“"”括起来；标签名和属性建议都用小写字母。编写代码，一般应该使用缩进风格，以便更好的理解页面的结构，便于阅读和维护。2.4编写HTML文件的注意事项为了使浏览器能正常浏览网页，在用记事本或别的HTML开发工具编写好HTML文档后，在保存HTML时，对HTML文件的命名要注意以下几点：文件的扩展名为.htm或.html结束，建议统一使用html作为文件名的后缀；文件名中只可由英文字母、数字或下划线组成；文件名中不要包含特殊符号，比如空格、$等；文件名区分大小写；网站首页文件名一般是index.html或default.html。2.5小实例编写一个HTML文件，在编写的时候要注意编写的注意事项，养成良好的编码习惯。<!--程序2-5--><html><head><title>页面的标题</title></head><body><p>这是我的第一个页面。<b>这是粗体文本。</b></p><imgsrc=”./img/welcome.jpg”></body></html>小结本章主要介绍了HTML文件的基本结构和基本语法。HTML

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论