HTML
1.基本介绍
1.1HTML(HyperText Markup Language)是超文本标记语言,是构建网页和应用程序的基础语言。它通过标记语言(即标签)来定义和描述网页的内容和结构。主要用于网页主体结构的搭建
1.2一般文档声明不需要我们自己去写,会自动生成
在本地的浏览器上解析的。而且,在自己的电脑上,同样许可创建一个html然后响应就是1.3在我们打开浏览器时,就有可能传输请求到了服务器上的html上,但解析
1.4专业词汇
1.5语法细节
感觉不难,使用的时候记着就好了
1.6结构解析
1.开始标签是<html>,而结束标签必须加“/”,为</html>
2.注释以<!--开始,以-->结束,如<!--这是注释,你好-->
2.常见标签
2.1 标题等
h1是双标签,意思是highline,在页面上想展示什么,在<boby>体里写就可能了
网页名字就是<title>也是双标签,显示的
<meta/>的形式,注意内容写在<>中,,meta的作用是就是<meta>是单标签,使用的设置字符集,如果字符集类型不符,会产生乱码的情况
<input>也是单标签,type和charset都是属性,在输入“password”后,就能实现输入密码的执行(好神奇)
效果
要打开文档,在桌面上创建文档并改后缀为html即可,再右键用记事本打开即可编辑
2.2 字号大小与换行
h1-h6效果,数字越大字体越小,h7不在官方定义的范围内
<p>使用来包裹文本的,<br>是用来换行的单标签
如果不用p,代码的换行对于实际界面显示是不起效的
2.3列表
具体标签看注释
效果
2.4 超链接
2.4.1具体看绿字注释,注意超链接标签是为双标签的<a>
效果,此处是可以点击的状态
目录层次
2.4.2 相对路径写法,以自身位置为出发点寻找目标资源点,如果跟自己在一个文件夹下可以直接写,如果不同再加前缀即可
../表示相对路径,从当前资源的上一层路径开始找,然后再在这个../后加路径
通过示例 必要的时候能够启用../不止一次,允许返回多层
通过效果 点返回能够成功返回上一层,不过如果文件的位置改变了,那么相对路径需要随之改变
2.4.3绝对路径示例
有个疑问,这个test不是也在a下面的b中吗,为什么不用写b
2.5 图片标签
作用就是在界面里引入一张图片
示例(上面是相对路径,下面是绝对路径)
当设定长/宽时,宽/长会自动锁定
效果
2.6表格标签
分为表头(第一行),表体和表尾,不过在代码中不写这几项也许可。倘若不写,浏览器会自动在自己内存中的这部分内容补充上tboby
2.6.1表的抬头必须要用表属性居中了 ,center是那个属性
表尾暂时不写
效果
2.6.2
想达成如下图效果怎么做?
加单元格
效果如图
怎么办?可以让第一个单元格扩大覆盖下面两个单元格
rowspan 占用行的操作,写下加上自己一共侵占的行数,再把原来两个格删除
效果如图
以同样的思路扩容、删除
再让扩容的单元格向右横向侵占格子,即可实现目标效果
2.7 布局相关标签
涉及一点css相关内容
一般设计都是用div方便,但是若是某些地方想特殊设置,用span比较方便
同时还可以设置背景色,长宽高之类,详情看图
效果
2.8 特殊字符
转义字符表
※3.表单标签
注意是form不是from
1.基本使用
目前还没有后端,不能使用url。而且这里需建立一个文件用于接收表单标签
定义了提交地址和方式后,以name为key,密码为value
也可以在后面设置默认值,可加可不加
能够看到网址栏也发生了改变,用的是key,value&key,value的形式展现
2.提交方式
Get方式,有诸多缺点,换成Post方式来看就是之前一直
此浏览器或者Live端不支持使用post,但是依旧可以按f12进入开发者设备看是否传输成功,行看到大家输入的素材被传输了
3.表单项标签
readonly字段-只读,不能修改
disabled字段-完全禁用,不可交互
checked 默认值
效果