• HTML之file控件、hidden控件、列表、div

    需要将文件上传时可以使用file控件：

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>form表单title>
    6. head>
    7. <body>
    9.  浏览 <input type="file"/>
    10. body>
    11. html>

     当以后需要提交数据给服务器，但是又不希望用户看到，此时可以使用hidden控件，虽然不会显示出来但最后提交的时候会提交上去。

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>form表单title>
    6. head>
    7. <body>
    9. <form action="http://localhost:8080/oa/save" method="get">
    10.     
    11.     <input type="hidden" name="usercode" value="111111"/>
    13.     机构代码：<input type="text" name="orgcode"/><br>
    14.     <input type="submit" value="保存"/>
    15. form>
    16. body>
    17. html>

     标签还可以设置readonly属性、disabled属性：

    readonly只读的，不能修改，可以被用户看到，表单提交的时候会提交该数据

    disabled只读的，不能修改，可以被用户看到，表单提交的时候不会提交该数据

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>form表单title>
    6. head>
    7. <body>
    8. <form action="http://localhost:8080/oa/save" method="get">
    9.     
    11.     用户代码：<input type="text" name="usercode" value="1234" disabled/>
    12.     <input type="submit" value="保存"/>
    13. form>
    14. body>
    15. html>

     扩展：设置文本框的最大输入长度

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>form表单title>
    6. head>
    7. <body>
    8. <form action="http://localhost:8080/oa/save" method="get">
    9.     
    10.     <input type="text" maxlength="3"/>
    11. form>
    12. body>
    13. html>

            div是图层，也可以叫盒子。div是专门用来做网页布局的，其实最早的时候网页元素的布局是采用table进行布局，但是table布局不够灵活。

            当代的网页元素布局都是采用div的方式，div套用div。也就是盒子套盒子。div布局会更加的灵活、方便。div和span都可以看做是盒子，他们有什么区别：

            div默认情况下会独自占用一行，span不会独自占用一行

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>divtitle>
    6. head>
    7. <body>
    8. <div id="div1">
    9.     我是一个div盒子
    10. div>
    11. hello world
    12. <span>
    13.     我是一个span元素
    14. span>
    15. hello world
    16. body>
    17. html>

    列表： 

            无序列表创建方式：

            无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。无序列表始于

      标签。每个列表项始于
    • 。列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。

              有序列表创建方式：

              同样，有序列表也是一个项目的列表，列表项目使用数字进行标记。有序列表始于

        标签。每个列表项始于
      1. 标签。列表项内部同样可以使用段落、换行符、图片、链接以及其他列表等等。

                列表可以嵌套，也可以指定序号类型，只要在需要指定类型的标签内添加type属性。比如：原本序号为1、2、3改为A、B、C

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>列表title>
    6. head>
    7. <body>
    8.     
    9. <ul>
    10.     
    11.     <li>中国
    12.         <ul>
    13.             <li>北京li>
    14.             <li>湖南li>
    15.         ul>
    16.     li>
    17.     <li>日本li>
    18.     <li>美国li>
    19. ul>
    20.  
    22. <ol type="A">
    23.     <li>水果li>
    24.     <li>蔬菜li>
    25.     <li>茶li>
    26. ol>
    27. body>
    28. html>
  • 相关阅读:
    HTML网页设计制作——响应式网页影视动漫资讯bootstrap网页(9页)
    华为孟晚舟：从最惨千金 到最强战士
    【OpenCV】计算视频的光流并跟踪物体calcOpticalFlowPyrLK
    java.lang.NoClassDefFoundError: ch/qos/logback/core/util/StatusPrinter2
    QT学习日记28——QT动态库制作和使用
    05 SpringBoot注册Web组件
    2. JVM-类加载子系统
    Java知识点
    191.回溯算法：组合总和|||（力扣）
    Flink 状态编程
  • 原文地址：https://blog.csdn.net/qq_62731133/article/details/127595942