HTML知识点

概述

1.什么是HTML?

严格意义上来说只能说是一种规范，一种浏览器上的规范。

2.HTML运行到哪儿？

运行在浏览器上。

3.HTML怎么开发？

a.新建一个HTML文件或HTML结尾的文件。
b.使用记事本打开就能开发，浏览器打开就能运行，不需要编译。

4.什么是web？

web就是网站开发

5.web程序员包括：

web前端程序员：需要精通html、css、JavaScript；
web前端主要负责的是：前端浏览器展示的效果；
web前端页面展示的时候，是需要动态的数据的，这些数据是后台java程序或者c++程序提供的。

6.HTML是哪个组织制定的标准呢？

w3c。

基本标签

段落标记 <p> </p>

标题字 <h1> </h1>（一共六个）

换行标记 <br>（独目标记）

水平线 <hr> <hr color="red">（独目标记）

color是一种属性，用来指定颜色值。

color是属性的名字，red是属性的值。

HTML的字符串可以使用单引号，也可以使用双引号。

HTML的语法很松散，不严格，去掉单引号双引号也可以。

HTML不区分大小写。

预留格式 <pre> </pre>（保留格式，在HTML源码上是什么格式，到网页上还是这个格式，不变。）

粗体字 <b> </b>

斜体字 <i> </i>

插入字 <ins> </ins>

删除字 <del> </del>

右上角加字 

右下角加字 

font标签

color是字体颜色。size是字号。

实体符号

补充：

<meta charset="utf-8">

1.这个是告诉浏览器采用哪一种字符编码方式打开该页面，一般这个编码方式要和文件的编码方式相同，不然会乱码。

2.Windows操作系统的浏览器在没有指定任何编码方式的时候，浏览器默认采用GBK的简体中文的方式打开，这是因为我们的windows操作系统是简体中文环境。

3.而我们程序员，一般工作区当中文件的编码方式是UTF-8,因为unicode（统一码）更加通用。

4.当前这个文件就是UTF-8的编码方式，如果不写以下代码，浏览器会采用GBK的方式打开，就会出现乱码。

空格&nbsp 

大于号&gt

小于号&lt

表格

基本表格 table（boder用来设置边框的宽度；1px表示1像素；width用来设置整个表格的宽度；height用来设置整个表格的高度）

行 <tr> </tr> ；列 <td> </td>

单元格合并

colspan用来表示列合并；rowspan表示行合并

th标签：th可以代替td做单元格，th中的内容会自动加粗，会自动居中。

thead、tbody、tfoot标签

一个table可以被thead、tbody、tfoot分隔为三部分。

这个语法主要是为了后期javascript提供方便。

背景颜色和背景图片

背景颜色：body标签的bgcolor属性指定背景颜色。

背景图片：body标签的background属性指定背景图片（嵌入）。

图片（开始标签和结束标签之间没有内容的话，可以直接把结束标签删除掉，开始标签末尾加/）

ing标签的属性有哪些？

src属性：用来指定图片的路径。

width属性：用来指定图片的宽度，高度会等比例缩放。（不要手动设置高度。）

title属性用来设置鼠标悬停时的提示信息。

alt属性用来指定当图片加载失败时候的提示信息。

超链接：通过超链接可以往服务器发送请求。

href属性表示：hot references，用来指定链接的路径。

链接路径可以是一个网络中的路径，也可以是一个本地的路径。

超链接的特点：鼠标停留在超链接上自动变成小手，超链接自动添加下划线。

图片可以做超链接。（标签嵌套使用）

超链接的target属性用来设置最终打开窗口的位置

blank：新窗口

self：当前窗口

parent：当前窗口的父窗口

top：当前窗口的顶级窗口

iframe 内部窗体

列表（type决定前面图案的样式）

无序列表 <ul> </ul>；有序列表 <ol> </ol>

表单（form）重点：

1.表单最终提交的时候，表单项的name属性非常重要，有name的才会提交，没有name是不会提交的。

2.浏览器的服务器提交数据的格式是？

url?name=value&name=value&name=value&name=value&name=value

3.以上提交数据的格式，是w3c指定的格式，所有浏览器都是这样的。（这个格式非常重要，必须背会，所有浏览器都是这样提交数据的）

4.文本框和密码框的value实际上是不需要程序员提供的，是用户输入的，类似于map。

什么是表单？有什么用？

1. 发送请求，并且携带数据给服务器。

2. 表单和超链接有共同的特征，就是都可以向服务器发送请求。

3. 只不过超链接是用户直接点击发送请求，不能填写数据。

4. 而用户点击表单提交的时候，不但可以发送请求，而且请求中还可以携带输入的数据。

5. 表单最主要的作用就是收集用户的信息。

怎么定义一个表单对象呢？语法格式

<form>

       表单项1：

       表单项2：

</form>

action属性

method属性：get、post

另外要注意一个网页上可以有多个表单对象。

form标签中有一个action属性，这个属性和超链接的href相同，都需要填写url。

按钮，提交表单的按钮，只要点击这个提交按钮，就发送请求了。

所有能够提交表单的按钮，type必须是submit，不能随便写。

button是一个普通按钮，不能提交表单。

登录的表单

http：//192.168.145.2:8080/crm/login(随便写的一个路径）

协议：http协议

访问的服务器IP地址是什么？192.168.45.2

访问这个服务器上的那个软件：8080端口对应的一个服务

crm/login:是这个服务器上的某个资源名（它可能是一段处理登录的Java程序。）

file控件

hidden控件

readonly与disabled

imput控件的maxlength（maxlength属性规定输入字段的最大长度，以字符个数计数）

HTML中元素的id属性

在HTML中任何一个节点上，都有id属性。

在同一个网页中，id属性是不能重复的。

id代表了这个节点，id是这个节点的身份证号。

后期学习了JavaScript之后，我们要通过JavaScript对HTML的节点进行增删改。对节点增删改的时候，需要先获取到该节点对象，id属性可以让我们方便的获取到该节点对象。

通过id属性可以很方便地在JavaScript中获取到节点，然后对这个节点进行操作，最终产生网页的动态效果，所以JavaScript可以让死气沉沉的网页活跃起来。

div和span

div和span都是图层（div和span都是盒子）每一个图层都是盒子。

什么是图层，有什么用？

每一个图层在网页中都是一个独立的盒子。

图层的最主要作用就是网页布局。

table表格不是可以布局吗？

table表格布局有什么缺点？不灵活。

div和span布局更加灵活。

定位

每一个div和span左上角的顶点，都有x和y轴的坐标;

通过这个坐标可以定位div在网页当中的位置；

后面讲css的时候，我们可以通过css样式进行定位。

很久以前都是采用table布局，现代化的网页都是采用div+span进行布局。

对于web前端来说，怎么调试程序？

每一个浏览器都内置了调试器。

使用快捷键F12可以调出来调试器。

div和span有什么区别？

div默认情况下独自占一行。

span不会独占行。