HTML5

HTML   超文本标记语言

标签

加粗

<strong></strong>

标题

自带换行

<h1></h1>     # 一级标题   在一个页面中,只允许存在一个h1标签

<h2></h2>     # 二级标题

<h3></h3>     # 三级标题

<h4></h4>     # 四级标题

<h5></h5>     # 五级标题

<h6></h6>     # 六级标题

a标签  超链接标签

<a href="超链接网址"></a>                        在本页面直接跳转

<a href="",target="_blank"></a>                在新标签页打开链接

锚链接

<a name="top"></a>                       # 埋点

<a href="#top">点我回到顶部</a>          # href = #点的名字   在点击链接时会回到埋好的点处

img 图片链接

可以连接本地图片,也可以连接网络图片

<img src="本地图片路径" alt="">             # alt 当图片加载失败,告诉用户一些信息

<img src="网络图片网址" alt="">       

<img src="" alt="" width=500px height="">                 # 图片宽高 注意同时使用的时候图片可能失真

<img src="" alt="" title="">                                          # title 鼠标放上去的时候显示的提示语

 p标签   段落标签

 包裹的文字自成一个段落

<p>文字</p>

div标签

除了换行,什么属性都没有

span标签

什么属性都没有 可塑造性很强

空白折叠现象: 在代码中的所有空白区域,在浏览器端都会渲染成一个空格

table标签 表格

自带换行

<table border="solid" style="border-collapse:collapse" width="500px" bgcolor="">        # border设置边框   border-collapse设置好看的边框   bgcolor设置背景颜色
  <caption>表格标题</caption>         # 设置表格标题 可以在table内任何位置写
  <tr>                                            # 行
    <td height=""></td>                   # 行内的一个单元格 height设置高度
    <td colspan="2"></td>              # 横向两个单元格合并
    <td rowspan="2"></td>             # 纵向两个单元格合并
  </tr>
</table>

列表标签

<ul type="">                                                 # 无序列表 可以通过type改变 desc 实心圆(默认) square 方块 circle 空心圆 
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>
无序列表
<ol type="" start="">                                       #有序列表 前面自动生成数字 可以通过type改变序号类别 A,a,I,i,1(默认) start 指定从哪个序号开始
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ol>
有序列表
<dl>                                                                     #定义列表
  <dt></dt>                            # 一级菜单
  <dd></dd>                          # 二级菜单 缩进
</dl>
定义列表

form 表单标签

<form action="">
    <label for="input1"></label>    for的内容指定到input的id上  一一对应的关系
    <div>用户名<input type="text" placeholder="请输入用户名" id="input1"></div>     # 普通文本  在输入框内显示提醒 
    <div>密码<input type="password" placeholder="请输入密码"></div>     # 密文显示
    <br>                              # 换行符
    <input type="submit">             # 提交按钮
    <input type="checkbox">           # 多选框
    <input type="radio" name="1">     #单选框
    <input type="radio" name="1">     #单选框  注意 设置同一个name属性时才是单选,name属性不一样时依然是多选
    <input type="file">               # 文件选择 调用操作系统的资源管理器
    <input type="date">               # 调用操作系统的日历
    <input type="hidden" name="qqq">  # 隐藏此输入框 携带一些其他的数据提交给服务器
    <input type="button" value="">    # 仅仅是一个按钮 value设置按钮上的字 没有作用 做点缀
    <input type="reset">              # 重置 清空页面中用户输入的内容
    <input type="image" src="">       # 一个提交图片,自带submit,需要通过src指定图片,可设置图片的宽高
    <textarea name="" id="" cols="30" rows="10"></textarea>     #文本框
    <select name="" multiple size="" >               #下拉框  multiple可以多选  size可以设置图片的宽高
        <option value="" selected>黄焖鸡</option>     # selected 默认选项
        <option value="">红烧鱼</option>
        <option value="">米饭</option>
    </select>    
</form>

name  id  class属性

name不是唯一的,id是唯一的,class是一个大类,不唯一

原文地址:https://www.cnblogs.com/sandy-123/p/10524900.html