HTML基础

来源：互联网发布：linuxapp源码下线编辑：程序博客网时间：2024/05/01 20:18

客户端技术：运行于客户端，由浏览器解释执行。

相关的技术有：HTML/XHTML、CSS、JavaScript

主流浏览器有：IE、Firefox、Chrome、Safari、Opera

（HTML最大的难点在于浏览器的兼容性）

Web浏览器的功能

（1）代理访问者提交请求

（2）作为HTML解释器和内嵌脚本程序的执行器

（3）用图形化的方式显示HTML文档

服务端技术：运行于服务器端，可与数据库进行交互。

相关的技术：ASP.NET、PHP、JSP

1.XHTML能做什么？

能实现网页的结构。

2.什么是HTML、XHTML

HTML ，超文本标记语言，最终的发展方向：HTML5

XHTML，扩展的超文本标记语言

3.什么是标记？

标记(Tag),也称为元素(Element),它就是完成某些功能的字符串。

4.标记的分类

4.1:根据是否包含子标记或内容

单标记：<标记名称/>

双标记：<标记名称>...</标记名称>

4.2:根据是否自然换行

内联对象：不换行

常见的内联对象：<span>、<a>

块级对象：可自然换行

常见的块级对象：<p>、<div>、<hn>、<ol>、<ul>、<li>

5.标记的属性

单标记：<标记名称属性名称="值" 属性名称="值".../>

双标记：<标记名称属性名称="值" 属性名称="值">...</标记名称>

标记的公共属性

style （用于声明样式）

class（类，用于CSS中使用样式）

title 注释(所有的浏览器都支持)

6.XHTML文档的规范

A.标记名称必须为英文小写字母

B.标记之间必须顺序嵌套

C.单标记必须以"/>"结尾

D.属性名称必须为英文小写字母

E.属性值必须括在引号之间

7.W3C的合法性验证

平台：http://validator.w3.org

8.XHTML文档的结构

一个HTXL文件重要由5部分组成：

结构标记<html>、头标记<head>、文档标题标记<title>、内容标记<body>、注释

格式为：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

</head>

<body>

正文内容

</body>

</html>

9.DTD:文档类型声明、文档类型定义

DTD实现的功能是定义文档结构，如谁是根元素？

根元素有哪些一级子元素？这些元素又有什么样的属性？

这些属性中哪些是必选的，哪些是可选的？等信息

在XHTML中DTD主要有三类：

Strict 严格类型

Transitional 过度类型

Frameset 框架类型

10.头标记可以包含以下子标记

(1)<meta/>用于定义网页的基本信息和页面编码格式或页面刷新频率

每value秒刷新一次页面

设置文本内容为HTML格式，采用utf-8编码集。

（2）<title>用于定义文档标题，出现在浏览器顶部，无属性，一个文档只能有一个标题

（3）<script>用于定义JavaScript脚本

（4）<style>用于定义内部样式表

（5）<link>用于为当前页面引入其他资源

网站例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

</head>

<body>

啊啊啊，啊啊啊啊，啊啊啊啊！

</body>

</html>

二、常用文本样式

加粗：<b>...</b>

加粗：<strong>...</strong>

倾斜：<i>...</i>

倾斜:<em>...</em>

下划线<u>...</u>

删除线<s>...</s>

删除线<strike>...</strike>

上标<sup>...</sup>

下标<sub>...</sub>

span标记:<span>...</span> (双标记的内联,不换行)

大一点：<big>...</big>

小一点：<small>...</small>

源代码：<code>...</code>

引用：<cite>...</cite>

font标记(W3C不推荐)：<font color="颜色" size="字号" face="字体">...</font>

三、段落与换行

段落：<p align="left|center|right">...</p>

换行：<br/>

<p>、<div>、<span>、<address>、<blockquote>、<pre>的区别

（1）<div>和<span>主要是将文档分为几个逻辑部分后，结合样式表分别控制它们的显示。

（2）<div>是块级元素，前后断行，用于组合一大块代码，可以作为独立的、严格的组织工具，且不使用任何格式与其关联。

（3）<span>是内联元素，前后不换行，用于处理一小块内联HTML中的行内分组。

（4）<p>是块级元素，前后断行并空一行，用于段落分段。

（5）<address>是块级元素，前后断行，用于向文件写入地址和联系信息，通常为斜体。

（6）<blockquote>是块级元素，前后断行并空出一行，主要用于引用文本。

（7）<pre>是块级元素，前后断行并空出一行，只要用于显示程序代码或类似信息。

四、标题

...

五、HTML实体(HTML Entity)

大于号：>

小于号:： <

单引号：'(IE浏览器不支持)或'

双引号： "

&符号： &

不间断空格：

注册商标®： ®

版权©： ©

商标TM：#8482

￥：人民币

¥日元

连接字符-：

六、水平线的使用

说明：noshade属性可以使水平线显示时无阴影效果。

0 0