一、html介绍
1、定义:html是一种超文本标记语言,也是一种标识性语言(不是编程语言)
标记:记号(绰号)
超文本:就是页面内容可以包含图片、链接,音乐,视频等素材。
2、为什么学习html?
(1)测试页面元素,了解页面元素(页面是html语言编写的)
(2)进行ui自动化需用到元素定位
3、html有哪些特点?
(1)简易性
(2)可拓展性
(3)平台无关性
(4)通用性
4、什么人员使用html?
(1)前端开发:
javascript +html+css
H5=html5(html第5版本) 互相装换成web页面和app页面
前端开发的职责: 负责页面设计,页面排版(html)
后端开发:负责后台业务逻辑,使用编程语言,前后端需要业务对接(python)
(2)测试
定位元素,实现ui自动化
5、html查看 方式?
(1)第一种方式:
fn+f12 或f12
(2)第二种方式
浏览器中====更多工具====开发者工具
6、如何查看元素?
f12+fn====点击小箭头=====在去点击自己要查看的元素
二、安装工具hbilder
(1)hbilder 编译器ide工具,是一个能编写html源码工具,也是一个开发工具;
(2)html就是我们被用做www的网址
(3)目前公司用web语言就html (h5)
javascript=js(简写)
(4)安装步骤:
a、百度中下载hbuilder
b、解压:
找到htbilder.exe
c.右键快捷桌面或直接打开
e点击图标,启动,点击暂不登录
三、html 应用
1、新建项目
2、编辑项目名称,项目位置
新建html文件
输入文件名称
html中的基本格式
如下:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>dcs默认格式</title> </head> <body> <p>我可以显示所有内容</p> </body> </html>
保存htnl文件,ctrl+s 包存
运行html 文件
(1)方法1
(2)方法2:ctrl+r,查看内容
快捷键
(1)ctrl+n+w 创建项目
(2)ctrl+n+h 创建html文件
(3)ctrl+s 保存)(未保存显示*号)
(4)ctrl+r 运行
(5)ctrl+z 撤回
(6)!+tab键 联想基本格式
(7)ctrl+/ 注释和取消注释
(8)ctrl+鼠标滚轮, 字体方大和缩小
二、html常用的标签
1、标题标签(h1--h6)
h1是最大的标签
h6是最小的标签
输入方式:
2、常用标签
(1)h1+tab键
(2)h2+enter键
1)  空格
(2)em 标签表示斜体
(3)i 标签表示斜体
(4)br 表示换行
(5)b 标签表示加粗
(6) strong 标签表示加粗
(7)s 标签表示删除线
(8)u 标签 表示下划线
(9)font 颜色
(10)sub下标
(11)sup上标
(12)p标签
3、图片标签
(1)通过本地图片导入
将图片存放在img中
(2)通过网络图片导入
a、通过f12进行抓取网上图片
b.通过图片右键,复制地址
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>图片标签</title> </head> <body> <!--引用本地图片--> <img src="../img/QQ图片20231212113155.png"/ width="100" height="100"> <!--引用网上图片--> <img src="https://qcloud.dpfile.com/pc/OlCJyDMIBRFzpnlljieGGqxW8EXqcvho2oTHX-e1d0b6yiiYeocFIjl9YnOm2Umq.jpg"/> </body> </html>