首页 > 其他分享> 文章详细

测试基础4——HTML

2022-08-23 00:32:41 阅读：165 来源： 互联网

标签：段落提交标签基础默认 HTML 测试属性

html介绍

前端三大核心技术

HTML：网页的架构，用来描述网页的一种语言
CSS：美化页面
JS：网页的行为（可控制HTML和CSS）

HTML标签

单标签<h>
双标签<b>内容</b>

标签属性

属性格式：属性名 = “属性值” e.g. <a href='xyz'>content</a>

HTML骨架

<!DOCTYPE html>
<html>
  <head>
      <meta charset="UTF-8">
      <title>xxx</title>
  </head>
  <body>
      content
  </body>
</html>

常用标签

注释

  <！--
    快捷键：ctrl+/
    扩展测试点：前端页面注释，上线前必须检查或删除。
  -->

标题标签

通过<h1>-<h6>进行定义，其中<h1>最大

<body>
  <h1>h1</h1>
</body>

段落标签

特点：1. 段落标签独占一行；2. 当换行符使用；3. 语义化（让浏览器明白此处为段落）

<p>段落</p>

超链接标签

通过<a>定义，href：点击文本跳转；target：值为_blank时，在新窗口打开（当值非target中定义的，则默认为_blank）

<body>
  <a href="hrrps://link" target="_blank">显示文本内容</a>
</body>

图片标签

通过<img>定义；属性：src：图片路径；titl：光标悬停显示文字,必备，无alt时显示title；alt：图片未加载时显示文字；width：宽；height：高

<body>
  <img src="路径（相对路径下的）" />
</body>

tips

相对路径：相对当前路径下的位置
同级：./
上一级：../
绝对路径：D:\文档\text\1.txt

换行和空格

换行：<br />；空格： 

布局标签

常用div和span。div：默认独占一行；span：默认一行多个。

<body>
  <div>
    div
  </div>
  <span>
    span
  </span>
</body>

form标签和input标签

表单标签通过<form>表示，提交用户输入的数据。
属性：1. action：将数据提交到哪个页面；2. method="get/post"（get：参数在url中显示，速度比post快，提交内容有长度限制，一般查询使用；post：反之，一般提交数据使用）

<form action="">
  文本：<input type="text" />
  密码：<input type="password" />
  单选：<input type="radio" name="a" /> ，其中name相同的选项互斥
  复选：<input type="checkbox" />多选
  按钮：<input type="button" value="按钮名" />，其中type="submit"为提交，type="reset"为重置
  下拉框：
  <select>
    <option>opt1</option>
    <option>opt2</option>
  </select>
  文本框：（cols：默认宽，rows：默认高）
  <textarea cols="23" rows="23"></textarea>
</form>

列表标签

通过<li>表示，分为有序、无序

<ol>
  <li>有序</li>
</ol>
<ul>
  <li>无序</li>
</ul>

其他常用标签

<script>：js语句
<style>：css样式
<link scr="link.css" />：从某网站动态加样式

标签：段落,提交,标签,基础,默认,HTML,测试,属性
来源： https://www.cnblogs.com/qlzf/p/16597306.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9