HTML 笔记大全.docx
- 文档编号:2884633
- 上传时间:2022-11-16
- 格式:DOCX
- 页数:33
- 大小:32.88KB
HTML 笔记大全.docx
《HTML 笔记大全.docx》由会员分享,可在线阅读,更多相关《HTML 笔记大全.docx(33页珍藏版)》请在冰豆网上搜索。
HTML笔记大全
1.HTML的简介
HTML:
超文本标记语言,网页语言。
超文本标记语言:
超出文本的范畴。
标记:
HTML所有操作都是通过标签实现的。
标签就是标记。
<标签>
HTML的后缀.htm或者.html。
HTML规范:
开始结束。
成对出现。
特殊的标签单个出现
换行。
内容:
1.
设置相关内容2.
显示在页面上的内容3.标签成对出现
4.标签不区分大小写。
5.有些标签没有结束标签,在标签内结束,
水平线。
HTML的核心思想(*****)
网页很多数据,不同的数据需要显示的效果不一样,这个时候需要使用标签把要操作的数据(包装起来),通过修改标签的属性值实现标签数据样式的变化。
一个标签相当于一个容器,想要修改容器内的样式,只需要改变容器的属性值,就可以实现容器内数据的样式变化。
HTML最常用的标签
2.文字标签和注释标签
*文字标签:
修改文字的样式
-
属性size:
文字的大小范围1-7超出默认为7。
color:
文字颜色两种表示:
1.英文单词:
redgreen。
2.使用16进制表示#ffffff
*注释标签:
--html的注释-->。
3.标题标签,水平线标签和特殊字符
标题标签:
大小依次变小自动换行
<>……水平线标签:
属性:
**Size:
水平线粗细**Color:
颜色
代码
换2行。
特殊字符:
<:
<>:
>空格:
&:
&
4.列表标签展示效果
- 传智播客
- 财务部
- 学工部
- 人事部
传智播客
财务部
学工部
人事部
***
表示列表范围
***
:表示上层内容
***
:表示下层内容
***
:表示下层内容
***………………………………………..
****
有序列表的范围
属性type:
设置排序方式1(默认)ai。
**在ol标签里面
代码:
- 财务部
- 学工部
- 人事部
****
有序列表的范围
属性type:
实心圆circle空心圆disc实心方块square,默认disc
5、图像标签(******)
--src:
图片的路径
--width:
图片的宽度–height:
图片的高度–alt:
图片上显示的文字。
6、路径的介绍
**绝对路径:
完整的路径。
**相对路径:
一个文件相对于类外一个文件的位置。
**html文件和图片在同一个路径下,直接把名字写在路径下。
**图片在html下一层的路径,把后面的路径拿过来用。
**图片在html上一层的路径,../加上图片的名字。
../../表示上2层路径。
7、案例联系
*
原样输出标签
8、超链接标签(*****)
***链接资源
href:
链接的资源的地址,里面的如果是空链接时”#”表示。
target:
设置目标打开的方式,默认在当前页打开。
_blank:
在新的页面打开。
_self:
在当前页面打开。
***定位资源
***如果想定位资源:
定义一个位置
**回到这个位置
9、表格标签(*****重要的很******)
在行标签的里面表示行里面的单元格 | 表格实现居中加粗标签 | |
---|---|---|
***表示每行的单元格。 |
表格技巧:
先数有几行有几行就有几个
**合并单元格
跨行:
rowspan=”几行”
跨列:
colspan=”几列”
10、表单标签
******form里面的属性
***action=”路径”数据跳到页面。
***method=”请求的方式”有以下2种。
1.get和post,默认是get。
2.get请求携带提交数据,安全性低,数据大小有限制。
Post相反。
*****enctype:
做文件上传需要设置这个属性。
**输入项:
可以输入内容和选择内容的部分。
必须加一个name属性。
必须有一个value属性值
--大部分的输入项使用
***普通输入项:
***密码输入项:
***单选输入项:
***文件输入项:
---在里面加属性:
name=””----Name属性值一定要一样
**实现默认选项checked=”checked”放在想选择的属性上。
***多选输入项:
---在里面加属性:
name=””----Name属性值一定要一样
----必须有一个value属性值。
必须加一个name属性。
***下拉输入项(不是在input标签里面的)。
**实现默认选项selected=”selected”放在想选择的属性上
***文本域
***隐藏项(代码中有而在页面上不会显示)
***提交按钮
?
输入项name的值=输入的值
***参数类似于key=value形式.
***图片提交按钮:
**重置按钮(回到输入项的初始状态)
**普通按钮
11、案例:
使用表单来实现注册页面。
-------使用表格实现页面效果。
-------超链接不想要她有结果href=”#”
-------如果表格里面的单元格没有内容,使用空格作为占位符&nasp;
-------使用图片提交表单
12、html中其他的常用标签的使用
b:
加粗
s:
删除线
u:
下划线
i:
斜体
pre:
原样输出
sub:
下标
sup:
上标
div:
自动换行显示块
span:
不会自动换行在一行显示块
p:
段落标签比br标签多换一行。
13、html的头标签的使用
*html两部分组成head和body
**在head里面的标签是头标签
**title:
表示游览器显示的内容。
**meta:
设置页面上的一些内容。
内容的意思。
刷新后面3表示内容刷新的时间为3秒.
**base标签:
设置超链接的基本设置
**link标签:
引入外部文件
**明天css,可以使用link标签引入css文件。
14、框架标签的使用
*
**如果在左边的页面设置超链接,让内容显示在右边的页面中
⏹设置超链接里面的属性,target值成名称
⏹
15、a标签的扩展
-XX是网络资源
-当a标签里面访问网路资源的时候,必须要家一个协议http:
表示一个网路的公共协议。
-如果加上http协议之后,自动识别访问资源是一个网络资源。
-当浏览器里面找到相关协议,首先看这个协议是不是公共协议http。
-如果不是公共协议,回去本地电脑支持这个协议的应用程序。
1、css的简介
**css:
层叠样式表
**层叠:
一层一层的
***样式表:
很多属性和属性值
*使页面显示效果更加好
*css将页面内容和显示样式进行分离,提高了显示功能。
2、css和html的结合方式(4种结合方式)
*.在每个html标签上面都有一个
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- HTML 笔记大全 笔记 大全
![提示](https://static.bdocx.com/images/bang_tan.gif)