HTML学习笔记(二)


页面结构分析

image-20211006141016170

iframe内联框架

<iframe src="path" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

通过内联框架实现:

<iframe src="" name="hello" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

<a href="path" target="hello">点击跳转</a>

表单

<form action="1.我的第一个网页.html" method="post">
    <p>name:    <input type="text" name="username"></p>
    <p>password:<input type="password" name="password"></p>

    <p>
        <input type="submit">
        <input type="reset">
    </p>

</form>

表单的元素属性

文本框和单选框:

<p>性别:
    <input type="radio" value="boy" name="sex"/><input type="radio" value="girl" name="sex"/></p>

多选框:

<p>
    爱好:
    <input type="checkbox" value="1" name="hobby">1
    <input type="checkbox" value="2" name="hobby">2
    <input type="checkbox" value="3" name="hobby">3
    <input type="checkbox" value="4" name="hobby">4
</p>

按钮

<p>点击:
    <input type="button" value="long" name="btn1">
    <input type="image" src="../resource/image/head.png" width="300">
</p>

下拉框

<select name="列表名称">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

文本域

<p>反馈:
<textarea name="textarea" cols="10" rows="5">文本内容</textarea>
</p>

文件域

    <p>
        <input type="file" name="files">
        <input type="button" value="上传" name="upload">
    </p>

邮箱验证

<p>
    邮箱:
    <input type="email" name="email">
    URL:
    <input type="url" name="url">
</p>
<p>
    数字:
    <input type="number" name="num" max="100" min="0"
    step="10">
</p>

滑块

<p>滑块:
    <input type="range" min="0" max="100" name="voice">
</p>

搜索框:

<p>
    搜索:
    <input type="search" name="search">
</p>


Author: Xi Chen
Reprint policy: All articles in this blog are used except for special statements CC BY 4.0 reprint polocy. If reproduced, please indicate source Xi Chen !
评论
  TOC