1.HTML (常用标签 网页的基本结构)
2.CSS (常用样式 网页的显示效果)
3.JavaScript (用户交互效果 动态效果)
4.jQuery (JavaScript库 简化原生js操作)
5.Ajax (异步数据交互 在页面不刷新的情况下进行数据交互)
6.BootStrap (前段UI框架 快速搭建静态页面并支持不同设备)
```

## HTML概述

### 一、什么是HTML

HTML 是用来描述网页的一种语言。

> 超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。

> HTML 不是一种编程语言，而是一种标记语言

> 标记语言是一套标记标签 (markup tag)

> HTML 文档包含了HTML 标签及文本内容

>HTML文档也叫做 web 页面

### 二、HTML是干嘛的

> 可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。

### 三、建立HTML文件

- .html
- .htm

### 四、HTML注释

```angular2html
<!--注释内容-->
```

### 五、HTML网页的基本结构

```angular2html
<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据
<body> 元素包含了可见的页面内容

```

#### 通用声明 （了解）
HTML5
```angular2html
<!DOCTYPE html>
```

HTML4.01
```angular2html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
```

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

### 六、HTML标签结构
HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

- HTML 标签是由尖括号包围的关键词
- HTML 标签通常是成对出现的
- 标签对中的第一个标签是开始标签，第二个标签是结束标签

```angular2html
<开始标签>内容</结束标签>
```

### 七、HTML元素

"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.
一个 HTML 元素包含了开始标签与结束标签

### 八、HTML属性

- HTML 元素可以设置属性
- 属性一般添加在开始标签
- 属性一般以名称/值对的形式出现，比如：name="value"。

**注意：**
- 属性值必须用双引号引起来
- 标签都用小写字母
- 双标签必须要写闭合标签

## HTML常用标签
### 一、HTML常用的块级标签（块级元素）
> 独占一行
#### 有语义的HTML块级元素
> 有默认样式
##### 标题（Heading）
> 通过H1～H6 标签来定义的.

##### 段落
>通过标签 p 来定义的.

##### 列表

无序列表 ul,li
> 是一个项目的列表,列项目使用粗体圆点（典型的小黑圆圈）进行标记

有序列表 ol,li
> 也是一个项目的列表，列表项目使用数字进行标记。

自定义列表 dl,dt,dd（了解）

**注意：**
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。

##### 表格 table,tr,td

table常用属性

- border 边框
- cellpadding 内容距离表框的距离
- cellspacing 单元格和单元格之间的距离
- rowspan 垂直合并（跨行显示）
- colspan 水平合并（跨列显示）
- anglin 内容水平对其方式
- valign 内容垂直对其方式

#### 无意义的块级元素 div

```angular2html
<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示换行。
一般与 CSS 一同使用
<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。
```

### 二、HTML常用的行级标签（行内元素）
不独占一行
### 有语义的行内元素

#### HTML链接 a标签

```angular2html
<a href="链接地址">链接文本</a>
```

target属性，定义被链接的文档在何处显示 _blank 新窗口打开

#### HTML图像

```angular2html
<img src="图片地址" alt="">
```

#### 文本标签
- b标签 i标签 strong标签 em标签

### 无语义的行内元素

- span标签 配合css使用

### 三、常用的实体字符

```angular2html
&gt;&lt;&copy;
```
### 四、表单标签
表单是一个包含表单元素的区域。通过form来定义表单区域
> 通过type属性定义不同类型的表单控件
- text 普通文本输入框
- password 密码输入框
- radio 单选按钮
- checked 多选按钮
- select 下拉框
- file 文件上传选框
- textarea 文本域
- submit 提交按钮
- reset 充值按钮
- hidden 隐藏域，要和表单单一其提交的信息

常用属性：
```angular2html
name 属性：表单项名，用于存储内容值
value属性：输入的值
disabled属性：禁用属性
readonly属性：禁用属性
checked属性：选择框指定默认选项
placeholder：提示
```
**注意：**
```angular2html
form 有两个必须存在的属性 action提交地址 metchod提交方式
post:通过request body传参，参数不可见，参数没有大小限制
get:通url进行传参，参数可见，不安全，大小有限制，

如果表单中含有文件上传
method提交方式必须为post
form中必须有enctype属性
enctype="multipart/form-data"

01-HTML控件的更多相关文章

  1. Windows程序==>>使用ListView控件展示数据

    使用ListView控件展示数据 01.ImageList控件 1.了解了解         属性 说明 Images 储存在图像列表中的所有图像 ImageSize 图像列表中图像的大小 Trans ...

  2. Windows程序控件升级==>>构建布局良好的Windows程序

    01.菜单栏(MenuStrip) 01.看看这就是menuStrip的魅力: 02.除了一些常用的属性(name.text..)外还有: 03.有人会问:上图的快捷键: 方法: 方式一:1.设置菜单 ...

  3. [2014.01.27]wfPrintOcx 票据打印控件 v5.3

    支持选择打印机,并自动记忆选择的打印机. 适合打印各类票据格式. 支持画正方形.长方形.圆形.椭圆.横线.竖线.HTTP图片. 支持数字金额转换成中文大写金额. 可以设置固定宽度的文字自动换行. 组件 ...

  4. Jquery 操作Html 控件 CheckBox、Radio、Select 控件 【转】http://www.cnblogs.com/lxblog/archive/2013/01/09/2853056.html

    Jquery 操作Html 控件 CheckBox.Radio.Select 控件   在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio ...

  5. Js表单验证控件（使用方便，无需编码）-01使用说明

    演示地址:http://weishakeji.net/Utility/Verify/Index.htm    开源地址:https://github.com/weishakeji/Verify_Js ...

  6. c#中的控件01

    1.常用控件: 只读文本:TextBlock.文本框:TextBox.按钮:Button 事件:鼠标移到按钮上的时候显示“大爷您来了”,离开 显示“大爷常来”,Click(点击).Loaded(控件加 ...

  7. 梦想CAD控件 2019.01.20更新

    下载地址:http://www.mxdraw.com/ndetail_10120.html1. 修改CAD不等比例块保存问题2. 修改CAD捕捉时,Z值对捕捉不准的影响3. 修改图片对象选择后,自动跑 ...

  8. 013.NET5_MVC_Razor扩展Html控件01

    Razor扩展控件  第一种方式: 1. 定义一个静态类 2. 定义静态扩展方法,扩展IHtmlHelper类型,返回IHtmlContent类型: 本质:通过后台方法,返回一个已经存在的Html标签 ...

  9. HTML5 progress和meter控件

    在HTML5中,新增了progress和meter控件.progress控件为进度条控件,可表示任务的进度,如Windows系统中软件的安装.文件的复制等场景的进度.meter控件为计量条控件,表示某 ...

  10. 技术笔记：Indy控件发送邮件

    工作中有个需求需要发送邮件,因为使用的delphi6,所以自然就选择了indy组件,想想这事挺简单的.实现的过程倒是简单,看着Indy的demo很快就完了,毕竟也不是很复杂的功能. 功能要求: 1.压 ...

随机推荐

  1. python+selenium模拟京东登录后台

    python+selenium模拟京东登录后台 import json from time import sleep from selenium import webdriver #from sele ...

  2. echart-折线图，数据太多想变成鼠标拖动和滚动的效果？以及数据的默认圈圈如何自定义圆圈的样式

    1.数据太多怎么办???想拖拽,想滑动 dataZoom: [ { type: 'slider', } ] dataZoom: [ { type: 'inside',  }] 两种功能都需要,还想调样 ...

  3. 基于函数计算 + TensorFlow 的 Serverless AI 推理

    前言概述 本文介绍了使用函数计算部署深度学习 AI 推理的最佳实践, 其中包括使用 FUN 工具一键部署安装第三方依赖.一键部署.本地调试以及压测评估, 全方位展现函数计算的开发敏捷特性.自动弹性伸缩 ...

  4. Linux技术学习要点，您掌握了吗---初学者必看

    1.如何做好嵌入式Linux学习前的准备? 要成为一名合格的嵌入式Linux工程师,就需要系统的学习软.硬件相关领域内的知识,需要在最开始就掌握开发的规范和原则,养成良好的工作习惯.为了确保学习的效果 ...

  5. ASP.NET上传一个文件夹

    之前仿造uploadify写了一个HTML5版的文件上传插件,没看过的朋友可以点此先看一下~得到了不少朋友的好评,我自己也用在了项目中,不论是用户头像上传,还是各种媒体文件的上传,以及各种个性的业务需 ...

  6. BZOJ 3887: [Usaco2015 Jan]Grass Cownoisseur tarjan + spfa

    Code: #include <bits/stdc++.h> #define setIO(s) freopen(s".in","r",stdin) ...

  7. [洛谷2257]YY的GCD 题解

    整理题目转化为数学语言 题目要我们求: \[\sum_{i=1}^n\sum_{i=1}^m[gcd(i,j)=p]\] 其中 \[p\in\text{质数集合}\] 这样表示显然不是很好,所以我们需 ...

  8. 【bzoj4136】[FJOI2015]带子串包含约束LCS问题

    题目描述: 带有子串包含约束的最长公共子序列问题可以具体表述如下. 给定2个长度分别为n和m的序列X和Y,以及一个子串包含约束集S. S中共有k个字符串S={S1,S2,…,Sk},其中字符串Si的长 ...

  9. 修改select的默认样式

    在我们用select的时候,通常因为他的默认样式比较丑而用自己样式,那首先要去掉他的默认样式 去掉select的边框和点击时的蓝色边框 select{border: none;outline: non ...

  10. windows 删除文件或文件夹

    删除文件夹 rd 文件夹名 (只能删除空文件夹) 删除整个文件夹及子文件所有 rd /s 文件夹名(删除该文件及子文件) 删除文件 del 文件名(删除该文件)