zoukankan      html  css  js  c++  java
  • HTML学记笔记

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="UTF-8">
    <title>显示在网页头上</title>
    </head>
    <body>
    任何标签都有三个属性
    <br>1.id
    <br>2.style
    <br>3.class 样式
    <br>
    <h1>1.h标签标题标签</h1>
    <h1>html学习</h1>
    <h2>html学习</h2>
    <h3>html学习</h3>
    <h4>html学习</h4>
    <h5>html学习</h5>
    <h6>html学习</h6>

    <!--2.img标签,可本地图片,也可网上链接图片--><br>
    <img src="1236.jpg" alt="图片出现问题说明" title="图片提示">

    <!--3.a标签,前网页可以跳转标签,#号加标签id,也可以跳转网页,默认当前页打开,target="_blank"在另外标签打开--><br>
    <a href="#a2">转转标签a1</a> <br>
    <a href="https://www.baidu.com/" target="_blank"> 跳转百度 </a> <br>
    <a href="" id="a2">转转标签a2</a><br>

    <!--4.加粗标签--><br>
    <b> 加粗b </b>
    <!--5.斜体标签--><br>
    <i> 斜体i </i>
    <!--5.下划线标签--><br>
    <u>下划线u</u>
    <!--6. 删除线标签--><br>
    <s>删除线s</s>
    <!--7.段落标签-->
    <p>段落p</p>
    <!--8.换行标签-->
    <br>换行标签br
    <!--9.水平线标签hr--><br>
    <hr>
    水平线标签hr
    <br> ol序列列表
    <ol type="1">
    <li>aaaaa</li>
    <li>bbbbb</li>
    <li>ccccc</li>
    <li>ddddd</li>
    <li>fffff</li>
    </ol>
    <br> ul非序列列表
    <ul type="square">
    <li>aaaaa</li>
    <li>bbbbb</li>
    <li>ccccc</li>
    <li>ddddd</li>
    <li>fffff</li>
    </ul>
    <br> ul非序列列表
    <ul type="square">
    <li>表格说明,table</li>
    <li>thead表头,</li>
    <li>tr列</li>
    <li>th行</li>
    <li>tbody表体</li>
    </ul>
    <br>table标签
    <table border="1">
    <thead>
    <tr>
    <th>姓名</th>
    <th>年龄</th>
    <th>爱好</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>小明</td>
    <td>20</td>
    <td>学习</td>
    </tr>
    </tbody>
    <tbody>
    <tr>
    <td>小明</td>
    <td>20</td>
    <td>学习</td>
    </tr>
    </tbody>
    </table>

    <h1> 标签*数量按tab键就是多个</h1>
    <h1>格式化 Code--->Reformat code </h1>

    <h3>标签的嵌套规则
    <br> 1.行内标签不能嵌套
    <br> 2.p标签不能嵌套块级标签
    </h3>
    <p>
    <br>HTML 标签
    <br>1.单标签和双标签
    <br>2.内联标签和块级标签(是否独占一行)
    <br>内联:span img a b
    <br>块标:div h1-h6 p hr ul li ol
    <br>嵌套规则:
    <br>1.内联的不能套块
    <br>2.p不能套块
    <br>3.展示用的和交互用的
    <br>4.table标签
    <br>5.列表
    <br>1.ul
    <br>2.ol
    <br>3.dl
    <br>6.特殊符号
    <br>1.&nbsp
    <br>2.&copy
    <br>3.&reg
    <br>4.&lt
    <br>5.&gt
    </p> <!--数据格式 enctype="multipart/form-data",上传文件必选这个属性 -->
    <form action="提交的地址" method="post" enctype="multipart/form-data">

    <p>用户名 type="text"
    <br>placeholder="小明"--->设置占位内容
    <br>value="小明"---->设置默认值
    <br><input type="text" name="username">
    <br><input type="text" name="username" placeholder="小明">
    <br><input type="text" name="username" value="小明">
    </p>
    <p>密码type="password"
    <input type="password" name="pwd">
    </p>
    <p> 性别1type="radio"
    <input type="radio" name="gender" value="男">男
    <input type="radio" name="gender" value="女">女
    <input type="radio" name="gender" checked value="保密">保密
    </p>

    <p> 性别2type="radio"
    <!--两各格式写法一样,推荐第一种写法-->
    <label>
    <input type="radio" name="gender2" value="男">
    男</label>

    <input type="radio" id="r2" name="gender2" value="女">
    <label for="r2">女</label>

    <input type="radio" name="gender2" id="r3" checked value="保密">
    <label for="r3">保密</label>
    </p>

    <p> 爱好 type="checkbox"
    <br>默认值checked
    <br>
    <input type="checkbox" name="爱好" checked value="篮球1">篮球1
    <input type="checkbox" name="爱好" value="篮球1">篮球2
    <input type="checkbox" name="爱好" value="篮球1">篮球3
    <input type="checkbox" name="爱好" value="篮球1">篮球4
    <input type="checkbox" name="爱好" value="篮球1">篮球5
    <input type="checkbox" name="爱好" value="篮球1">篮球6
    </p>
    <p>
    select标签 多选multiple 默认值selected
    <select name="省份" id="1" multiple>
    <optgroup label="北京">
    <option value="bcp1" selected>昌平1</option>
    <option value="bcp2">昌平2</option>
    <option value="bcp3">昌平3</option>
    <option value="bcp4">昌平4</option>
    <option value="bcp5">昌平5</option>
    </optgroup>
    <option value="bj">北京</option>
    <option value="dh">上海</option>
    <option value="vw">重庆</option>
    <option value="dv">四川</option>
    <option value="df">山东</option>
    </select>
    </p>
    <p>说明备注
    <textarea name="info" id="1" cols="30" rows="10"></textarea>
    </p>
    <p>上传图片 form里要加这个 enctype="multipart/form-data"
    <input name="file" type="file">
    </p>
    <p>日期
    <input name="date" type="date">
    <input name="date" type="datetime-local">
    </p>
    <p>
    <input type="submit" value="提交aaa">
    <!--#普通按钮button#-->
    <br><input type="button" value="普通按钮button">
    <br><input type="reset" value="清空按钮">
    <br>type="email"邮箱<input type="email" name="email">
    <br>type="hidden"隐藏框用于加id提交数据用<input type="hidden" name=" 隐藏">
    </p>
    </form>


    </body>
    </html>
  • 相关阅读:
    装饰器 如何理解Python装饰器?
    python装饰器详解
    window 10下安装jdk
    Linux中pam认证详解(上)
    VMware/KVM/OpenStack虚拟化之网络模式总结
    java问题排查命令
    今日面试问题
    Qwtplot3D Qt5.12.0 MinGW 编译运行
    20212022年寒假学习进度06
    Springboot笔记<10>常用注解总结
  • 原文地址:https://www.cnblogs.com/djtang/p/9850925.html
Copyright © 2011-2022 走看看