多测师拱墅校区肖sir_高级金牌讲师_html讲解
html
一、html 介绍
1、定义：超文本标记语言，也是一种标识性语言；（不是编程语言）
标记理解为：记号（绰号）
超文本：就是页面内容可以包含图片，链接，音乐，视频等素材；
2、为什么学习html？
（1）测试页面元素，了解页面页面元素 （页面是html语言编写的）
（2）进行ui自动化需要用到元素等位
3、html有哪些特点？
（1）简易性
（2）可拓展性
（3）平台无关性
（4）通用性
4、什么人员使用html？
（1）前端开发
javascript+html+css
H5==html5 （html第5版本）
前端开发的职责：负责页面涉及，页面排版
后端开发：负责后台业务逻辑，使用编程语言，前后端需要业务对接
（2）测试人员
定位元素，实现ui自动化
5、html 查看方式？
第一种方式：
fn+f12 或f12
第二种方式：
浏览器=更多工具开发者工具
6、如何查看元素？
f12====点击【小箭头】===点击你要查看的元素
7、如何切换web和app端的模式（h5界面）？
二、html工具的安装
1、hbilder工具
（1）hbuilder 是编译器 ide工具，比那些html源码的工具，也是一个开发工具
（2）html就是我们被用作www的信息表示语言
（3）目前公司用的web语言就是html （简称h5）
javascript =js
2、安装步骤：
（1）下载工具包，
（2）解压工具包
3、点击应用程序
4、创建快捷方式桌面
5、点击快捷方式
6、点击暂不登录
7、说明安装成功
三、html 运用
1.新建项目（快捷方式：ctrl+n+w）
2、
2、新建html文件（快捷方式：ctrl+n+h）
文件 ：
3、介绍html基本格式
4、注释和取消注释
ctrl+/ 注释
ctrl+/ 取消注释
5、运行html编辑内容：案例
=============================================
html快捷键：
（1）ctrl+n+w 创建项目
（2）ctrl+n+h 创建html 文件
（3）ctrl+s 保存 （未保存显示* 号）
（4）ctrl +r 运行
（5）ctrl+z 撤回
（6）！+tab 联想基本格式
（7）ctr+/ 注释和取消注释
（8）ctrl+鼠标滚轮 字体放大和缩小
=============================================
认识标签：
一、标题标签
h1-h6
h1是最大的标签
h6是最小的标签
输入方式：
（1）h1+tab键
（2）h1+enter键
二、段落标签（p标签）
操作方式 ：p+tab
三、其他标签
1、  空格
2、em 标签表示斜体
3、i 标签表示斜体
4、br 表示换行
5、b 标签表示加粗
6、 strong 标签表示加粗
7、s 标签表示删除线
8、u 标签 表示下划线
9、font 颜色
10、sub下标
11、sup上标
======================
图片标签
1、引用本地图片
（1）下载好图片，在img的目录下拖拽图片或存放到指定的目录中·
2、引用网上图片
先网上找到图片的连接，有格式的注意png，jpg
比如1：http://img.smyhvae.com/20200122_200901.png
比如2：http://api.cbquan.com/Uploads/Images/Medias/GuangGaoSale/77/190723124159274513.jpg
获取图片链接：
链接标签：
1.义：从一个网页指向另一个网页的目的地，这个目标可以是一个网页，也可以是相同网上的位置，还可以是图片，一个文件，一个应用程序等；
2. 四种类型
（1）新连接覆盖原连接
（2）新开一个窗口
（3）图片连接
（4）死链接
3、案例：
1）新连接覆盖原连接
多测师
（2）新开一个窗口
（3）图片连接
（4）死链接
渣男
====================================
列表标签：
1、有序列表
ol 表示有序列表， （order lists 简称ol）
修改排序内容：a 、A、1 有序
快速生成有序列表
案例： ol2>li3
2、无序列表
ul 表示无序 （unordered lists 简写：ul）
无序类型：
circle 空心圆点
disc 实心方块
square 实心圆点
快速生成无序列表：
ul2>li3
表格：
border 边距
align（对齐）=“center” （居中）
cellspacing（单元格与单元格的距离）
cellpadding（单元格与内容的距离）
width（宽度）
height（高度）
表格标签
| 姓名 | 年龄 | 性别 |
|---|---|---|
| 1行第一列 | 1行第二列 | 1行第三列 |
| 2行第一列 | 2行第二列 | 2行第三列 |
| 3行第一列 | 3行第二列 | 3行第三列 |
合并行：
rowspan =“行数”
合并列：
colspan =‘行数’
表单：
表单标签：
表单标签格式：form
action：开始网址 method：get和post等等
表单标签：主要用来收集用户输入信息如：登入、注册、搜索商品等
用户名格式：text （明文）
密码格式：password （密文）
性别：radio 性别格式 性别是单选，单选类型是radio，注意name要加上sex，不然会出现同时可以选择2个radio的bug，加checked表示默认值
复选框：checkbox 文本框：textarea
上传文件：file 选择框：select
button：按钮 reset：重置
submit：提交
案例：
表单
<p>用户名:<input type="text" name="" id="" value="" /></p><p>密 码<input type="password" ame="" id="" value=""/></p><p><input type="radio" name="sex" id="" value="" />男<input type="radio" name="sex" id="" value="" />女</p><p><input type="checkbox" name="" id="" value="" />python<input type="checkbox" name="" id="" value="" />html<input type="checkbox" name="" id="" value="" />mysql<input type="checkbox" name="" id="" value="" />php</p><p>学历：<select name=""><option value="">清华</option><option value="">北大</option><option value="">种田</option><option value="">社会</option></select></p><p>文本：<br /><textarea name="" rows="5" cols="10"></textarea></p><p><input type="button" id="" value="" /> 按钮<input type="submit" name="" id="" value="" />提交<input type="reset" name="" id="" value="" />重置</p></form>
</body>
多测师拱墅校区肖sir_高级金牌讲师_html讲解相关推荐
- 多测师拱墅校区肖sir_高级金牌讲师_接口测试之接口文档和接口用例
一.接口文档 二.接口用例 ============================= 一.接口文档 1.接口接口结构 (1)url 接口路径(请求协议,ip,路径) (2) 请求方式 (post,g ...
- 多测师拱墅校区肖sir_高级金牌讲师_python之模块
python之模块 一.模块的介绍 (1)python模块,是一个python文件,以一个.py文件,包含了python对象定义和pyhton语句 (2)python对象定义和python语句 (3) ...
- 多测师拱墅校区肖sir_高级金牌讲师_python之封装，多态，继承
一.封装名可名 (1)定义:封装就是指隐藏对象中一些不希望外部所访问的属性和方法,即为保证安全 (2)概念:指的是在设计类时,不对外提供,隐藏起来,提供公共方法以外的方法(就是把属性和方法封装到一个抽 ...
- 多测师杭州拱墅校区肖sir_高级金牌讲师_项目实战之银行项目
银行项目 浙商银行 宁波银行 泰隆银行 招商银行 工商银行 杭州银行 浙江农商银行 ======================================= 一.银行项目 案例1: 1.不要强调 ...
- 多测师拱墅校区肖sir___性能测试之硬件指标
nmon 工具 1.了解nmon工具性能介绍 nmon 工具可以为 AIX 和 Linux 性能专家提供监视和分析性能数据的功能,其中包括: CPU 使用率 内存使用情况 内核统计信息和运行队列信息 ...
- 多测师拱墅校区_肖sir_设计用例方法
一.认识基本术语 1.动态测试 :通过运行软件的组件或系统来测试软件 2.静态测试:对组件的规格说明书进行评审,对静态代码进行走查 3.正式评审:对评审过程及需求文档的一种特定评审 4.度量:测量所使 ...
- 多测师拱墅校区_肖sir_编写测试用例
用例编写技巧 一.测试工作重点: 编写测试用例.执行测试用例 ================= 二.测试的基本流程(h模型) 1.拿到需求文档 2.分析和了解需求 3.编写测试计划 4.xmind ...
- 多测师拱墅校区__肖sir__项目讲解（1）
一. 项目类型 1.金融类型 银行.保险,基金.股票.证券.贷款.信用卡.外汇.期货.数据货币.黄金.白银.理财.p2p等 2.电商类: 淘宝.京东.拼多多.唯品会.得物.1688批发网.闲鱼.苏宁易 ...
- 多测师拱墅校区_肖sir_linux命令（1）
linux命令 一.linux命令 1.ifconfig 查看IP地址 2.ssh ip 链接xshell 3.虚拟机中快照功能:备份系统,还原系统 4.service iptables stop 关 ...
最新文章
- Apache Kudu 1.9.0 发布，支持位置感知
- VBS递归遍历文件夹
- prototype.js 让你更深入的了解javascript的面向对象特性
- 推荐 GitHub 2K+ 星：前端监控工具 - webfunny 项目
- 四种解法——求子序列的最大连续子序和(普通解法、求和解法、分治法、O(n)级解法)（面试经典题）
- python实现简单小游戏_python实现简单井字棋小游戏
- 内核线程和用户线程（SMP）
- 《计算机网络：自顶向下方法（原书第6版）》一第1章
- 沈阳大学生招聘2020计算机,2020沈阳市高校毕业生基层公共岗位服务计划人员招录600人...
- linux getopt源码,linux getopt()
- wchar_t转为char*
- linux抓包UDP流量
- Navicat或PLSQL如何导出表结构到Excel中
- 字符串--------KMP算法（studying）
- 四叶草关闭啰嗦模式_真正的高性能车！Giulia 四叶草评测
- CTF Crypto/MISC 在线工具网站
- 0x3f3f3f3f 和0x3f3f3f3f3f3f3f3f
- color demura原理_一种消除液晶屏高温MURA的工艺研究
- 地面站定制开发无人机教程分享
- 顺顺网页电子表格控件开源下载