HTML常用标签
@ EatFog · Wednesday, Apr 29, 2020 · 1 分钟阅读 · 更新于 Apr 29, 2020

今天学习了HTML常用标签,接下来写笔记

Http-server

  • 用httpserver打开html,http-server . -c-1 //去除缓存把当前目录设为本地web
  • 这样打开web比直接打开html要科学

a标签

 <a href="https://www.baidu.com" target="_blank">点击进入</a>
  • href:点击a标签后要去的地址
  • download:href为要下载的文件的路径,download属性为下载后文件的名字
  • JavaScript伪协议:href中写”JavaScript:alert(1)“,就会运行alert(1)
  • target:_blank空白页面;_top如果有iframe,在最顶窗口打开;_self在本层页面打开,即iframe中的在iframe打开;_parent在父窗口中打开,其中也可以写iframe的name

iframe

 <iframe src="要做frame的html" name="frame的名字"></iframe>
  • target可为frame的名字

table

<table class="t1">
        <thead>
            <tr>
                <th></th>
                <th>age</th>
                <th>father</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>jjj</td>
                <td>11</td>
                <td>33</td>
            </tr>
            <tr>
                <td>aaa</td>
                <td>12</td>
                <td>33</td>
            </tr>
        </tbody>
        <tfoot>
            <th>all</th>
            <td></td>
            <td></td>
        </tfoot>
    </table>
  • table就是表标签
  • thead表头,tbody表主体,tfoot表尾部
  • th(table head)写在thead中,每列的名字
  • tr(table row)表的一行
  • td(table data)写在tr中,内容。

img

<img src="./img.jpg" alt="加载失败" style="max-width:70%;"/>
  • img是图片标签,其本质是发出get请求获取图片资源
  • src:图片地址绝对路径,相对路径,url都行
  • alt:加载失败替换的文字
  • height,width:宽高,只写一个另一个自适应 !!!不能图片变形!!!
  • onload加载成功函数,onerror加载失败,要在标签后写监听函数。
  • max-width:最大宽度,设置为百分比,可以让过大的图去自适应。

form

<form action="/none" target="_blank" method="POST" autocomplete="off">
        <input type="text" name="id">
        <input type="password" name="password">
        <select name="select" id="select">
            <option value="1">周一</option>
            <option value="2">周二</option>
            <option value="3">周三</option>
        </select>
        <input type="submit"/>
    </form>
  • 表单标签,用来传送数据
  • action:向哪个页面提交
  • method:提交方式
  • autocomplete:提示补全表单
  • target提交时跳转方式
  • onsubmit提交事件
  • form必须要有type=submit的button或者input提交
  • input中一定要有name,提交内容的名字
  • * select:选择框,option是选项,value为option选项值。

input

<input type="text" name="id">
  • 表单中要提交的内容
  • text:文本
  • color:颜色
  • passwor:d密码
  • radio:单选框,name选项类型,可以将radio组合起来
  • checkbox:多选框,name选项类型,可以将checkbox组合起来
  • file:上传文件(multiple多选文件)
  • textarea:多行文本(resize:none;不可更改)

自我介绍

Hi!我是蒋俊杰

你也可以叫我EatFog

这是我的第一个blog

社交链接