html学习总结

来源：互联网发布：淘宝宝贝找不到了编辑：程序博客网时间：2024/06/13 02:26

第一部分html

一、什么是html？

全称：Hyper Text Markup Language 超文本标记语言。用于描述网页文档的一种标记语言。

二、html标签

html分为单标签和双标签
html标签是由尖括号包围的关键词，比如 <html>
html 标签通常是成对出现的，比如 <b> 和 </b>
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签

三、html文档

html文档又被称作网页
Web浏览器的作用是读取html文档，并以网页的形式显示出它们。浏览器不会显示html标签，而是使用标签来解释页面的内容。
结构：由head和body组成
<head></head>标签中包括单标签<meta>,<meta/>主要用来描述html网页文档的属性，也称作元信息。比如作者和日期时间、网页相关描述、关键词等。
<head></head>标签中还包括双标签<title></title>,两者之间的内容是显示在浏览器的标题栏上的信息。
<body></body>标签是web页面的主要部分，其中的内容是人们可以实际看到的网页信息。

四、html中的注释

<!- -AAA- ->“AAA”为注释内容

五、html文档类型

在网页源代码中，我们通常会看到<!DOCTYPE html>这样的标签，此标签不是html标签，它的作用是告知浏览器文档使用哪种html或xhtml规范。

六、html基本语法

双标记  <标记>内容</标记>   如：<html>  …… </html>单标记  <标记>  如：<br />标记属性  <标记 属性1=value1 属性2=value2 属性3=value3 …>  key=value  如：<body bgcolor=“#00ff00”>

七、常见标签

1.基本标签

<html>                   定义 HTML 页面，根标签<head>                   页面头部<meta>                   HTML 页面的元信息html4:  <meta content="text/html" http-equiv="Content-Type" charset="UTF-8"/>html5:  <meta charset="UTF-8" /><title>我的主页</title>          文档的标题    <link>                      引入外部资源（了解）<style>…</style>               定义或引入样式（了解）</head> <body>…</body>                 页面体</html>

2.文本标签

<h1>...</h1>                    标题字大小（h1~h6）<p>...</p>                      段落<br/>                           换行<ul>…</ul>                     无序列表 <ol>…</ol>                     有序列表<li>…</li>                     列表项目<a href=”…”>…</a>             文字超链接<a href="#dest">destination</a> 锚点及其使用<a name="dest">destination is here!!!</a>  <pre>...</pre>                  保留文档样式<b>...</b>                      粗体字，尽量不用bold<strong>...</strong>            粗体字(强调) <em>...</em>                    强调，表示为斜体，没有strong强

3.图形标签

<img src="" alt="">             定义图像 alt属性,注意src的相对和绝对路径<a href=""><img src="" /></a>   图像超链接 <hr/>                           水平线

八、标签的分类

标签除了可以分为单标签和双标签外还可以有如下三种分类：
块状元素
行内元素
行内块状元素

常用的块状元素：<div> <p> <h1>…..<h6> <ol> <ul> <dl><table><address> <blockquote> <form>

常用的行内元素：<a> <span> <br> <i> <em> <strong> <label> <q> <cite> <code> <var>

常用的行内块状元素：<img> <input>

块级元素特点：display:block;
每个块级元素都从新的一行开始，并且其后的元素也另起一行。
元素的高度、宽度、行高以及顶和底边距都可设置。
元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。
行内元素特点：display:inline;
和其他元素都在一行上；
元素的高度、宽度及顶部和底部边距不可设置；
元素的宽度就是它包含的文字或图片的宽度，不可改变。
行内块状元素的特点：display:inline-block;
和其他元素都在一行上；
元素的高度、宽度、行高以及顶和底边距都可设置。

阅读全文

0 0