对html文档的基本格式总结,html全部总结

html总结

基本结构

1.简单的基本结构

标题

网页主体内容

head不打印在网页上面，只有body里面的文字内容打印在网页上面

---

是分割线

添加背景元素的话需要添加在body开始标签的后面

比如

语法：……标签名>

文档类型声明

声明必须放在html文档的第一行

网页编码设置

在

标签之间添加

utf-8可以换成你想要的编码

文字和段落标签

文字斜体：,

文字加粗：,

下标：

上标:

⚠：只是斜体而已，更多表示强调！！！！！！

⚠：只是斜体，表示强调

特殊符号：那比如说你想在网页上打印出来

你是无法打印出来的因为这时候它们会自动被读取

所以你需要用特殊的符号来代替里面的一些符号

比如：

&lt < 小于或显示标记

&gt > 大于或显示标记

&reg 已注册

&copy 版权

&trade 商标

&nbsp 空格

标题标签：

~

段落标签：

align对齐属性：

left 左对齐内容

right 右对齐内容

center 居中对齐

justify 对行进行伸展

属性的例子：

表示这个段落左对齐了

换行标签

:不需要输入空格代码和
保留编辑器里的文本格式

所以多用于书写代码

列表标签

列表分为有序列表，无序列表，和定义列表

1.有序列表是

来区分每一项

type属性值

1 数字1，2.....

a 小写字母

A 大写字母

i 小写罗马数字

I 大写罗马数字

2.无序列表是

中间也是以来区分每一项

无序列表的type属性

disc 圆点

square 正方形

circle 圆形

3.定义列表

中间以来定义列表项，来列表项描述和他们是平级，所以不可以互相包含可以有多个

图像标签：

语法：

img属性

src url 显示图像url(分为相对路径和绝对路径)

alt 文字 图像代替文本

height 数值和百分比 图像的高

width 数值和百分比 图像的宽

alt：当用户无法查看图像，alt属性可以代替图像显示在浏览器中的内容

锚链接

同一个页面：

由一个链接跳转到另外一个

语法：

内容

属性：

href 链接地址,可以链接网站内部或者外部链接

target 链接的目标窗口

title 链接提示文字

name 链接命名

定义锚：

目录1

目录2从这两个开始跳转

内容

xxxxx

xxxxxxxx

内容

xxxxx

xxxxxxxx

锚名的位置定义了锚开始的位置

总结：

1.定义锚的位置和锚名

2.设置寻找锚的链接

不同网页：

定义锚：

网页1:……从网页1跳转到网页2

网页2:……被跳转的那个页面

电子邮件链接：

……

在本网站的内部跳转：站内链接

站内和站外链接：

e.g.

站内链接：

假设从网页1跳转到网页2

网页1:

网页2:

地址在html12.html

外部网站链接：

(比如友情链接)(一般使用绝对路径)

……

空链接：

……

不会发生任何跳转

但是会保留链接的特点

target属性：

默认情况下打开一个新的页面是在当前页面打开我们想要的

target拥有的属性：_self,_blank,_top,_parent

_self(当前窗口打开)

_blank(新页面打开)

html表格

比如购物单就是用表格创建的

表格主要的标签：

`

单元格` 基本语法与结构 ……. …………………

………

………………….

…………………..

e.g.创建两行三列标签

		td>

表格的操作：

带表头的表格：

:表格头，内容居中，加粗显示……：表格标题，居中显示，放在table下面，每一个table只有一个caption

表格结构标签：

表格划分三部分：表头，主体，脚注

－thead：表格的头(放表格的表头)

－tbody：表格的主体(放数据本体)

－tfoot：表格的脚(放表格的脚注)

e.g.

表头

主体脚注

这三个标签不会影响布局，主要功能是加载

不管body还是head还是foot改变书写顺序，thead总是在表格最上方

Width pixels,% 规定表格的宽

align Left,center,right 表格对齐方式

border pixels 表格边框宽度

Bgcolor rgb(x,x,x),Colorname 表格背景颜色

Cellpadding Pixels,% 单元边沿与其内容之间的空白

cellspacing Pixels,% 单元格之间的空白

frame 属性值 规定外侧边框的哪一个部分是可见的

rules 属性值 规定内侧边框哪一个部分是可见的

Frame：

void 不显示外侧边框

above 显示上部的外侧边框

below 显示下部的外侧边框

hsides 显示上部和下部的外侧边框

vsides 显示左边和右边的外侧边框

lhs 显示左边的外部边框

rhs 显示右边的外部边框

box 在所有四个边上显示外侧边框

border 在所有四个边上显示外侧边框

rules:

none 没有线条

groups 位于行组和列组之间的线条

rows 位于行之间的线条

cols 位于列之间的线条

all 位于行和列之间的线条

标签属性：

align Left,center,right,justify,char 行内容的水平对齐

Valign top,middle,bottom,baseline 行内容的垂直对齐

Bgcolor rgb(x,x,x),#xxx,colorname 行的背景颜色

和 标签属性

align

valign

bgcolor

width

height

跨列属性colspan：

e.g.

td colspan =“2”

就是说把两列合并成一列，多余的那个删掉

跨行属性rowspan：

把行合并在一起，多余的那个删掉

表格嵌套：

……

……. ………

必须是完整的表格，并且只能放在td当中

表单

创建表单：

表单元素

⚠：表单本身不可见

我们网页里看到的是表单元素

表单元素添加：

表单输入标签

菜单和列表标签

菜单和列表项目标签

文字域标签

菜单和列表项目分组标签

标签：

type属性值：

text 文字域

password 密码域

file 文件域

checkbox 复选域

radio 单选域

Button 按钮

Submit 提交按钮

Reset 重置按钮

Hidden 隐藏域

image 图像域

单行文本域：

Name 文本域的名称

Maxlength 指用户输入的最长字符长度

Size 指定文本框的宽度

Value 指定文本框的默认值

Placeholder 规定用户填写输入字段的提示

哪个里面放input哪个是默认选项

name 确认哪一组数据是同一组

图像域：

隐藏域：

用户看不到

value：里是传给服务器的值

下拉菜单和列表标签：

例如：城市的选择

and

语法：

选项

选项

……

标签属性：

name 设置下拉菜单和列表的名称

multiple 设置可选择多个项目

size 设置列表中可见选项的数目(相当于一次可以看到几个)

标签属性

selected 设置选项初始选中状态(看到的第一个就是他)

value 定义送往服务器的选项值

分组下拉菜单和列表标签：

选项

选项

…..

选项

选项

…..

…..

多行文本域:

(就是比较大，还有滚动条)

在textarea中输入的内容，就会自动显示在文本域内

的属性：

name 设置文本区的名称

placeholder 描述文本区域内预期值的简短提示

rows 设置文本区内的可见行数

cols 设置文本区内可见宽度`

表单属性：

语法：

表单元素

标签：

action ，URL 提交表格时向何处发送表单数据

method get,post 设置表单以何种方式发送到指定页面

name form_name 表单的名称

target _blank,_self,_parent,_top 在何处打开action URL

enctype application/plain….. 在发送表单数据之前如何对其进行编码

post和get的区别：

GET：使用url传递参数

对所有信息的数量也有限

一般用于信息的获取

POST：表单数据作为对于http请求体的一部分

对所发送信息的数量无限制

一般用于修改服务器上的资源

和

是一个容器标记，可以包含段落，表格，图片等各种html元素

没有任何意义，为了应用样式

html标签

块级标签：类似div，占据一行，换行

行内标签：类似span，在一行不换行

标签嵌套：

块级元素(占据一行，换行)：

`

,

• ,

1. ,
2. ,

   ,

   ~

   ,

   ,

   ,

   ---

   …..`

   行内标签(在一行，不换行)：

   `,,,,,<sup>,<sub>,,`</sub></sup>

   块级元素可以包含行内元素和某些块级元素

   div基本上可以包含全部块级元素

   行内元素不能包含块级元素，只能包含行内

   特殊块级元素只能包含行内元素，不能包含块级元素：

   如：h1~h6,p,dt

   块级元素和块级元素并列是对的

   行内元素和行内元素并列是对的

   e.g.

   html案例

   

   • HTML5
   • JAVASCRIPT
   • CSS
   • PHP
   • IOS
   • ANDROID
   • PHOTOSHOP

   如何成为优秀的工程师

   2天前 &nbsp308浏览nbsp;&nbsp308;1.评论

   复制内容

   作者

   HTML标记语言

   

   CSS层叠样式表

   

   什么是javascript

   

   只学有用的