• 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>
    8. 浏览 <input type="file"/>
    9. body>
    10. html>

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

    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. <input type="hidden" name="usercode" value="111111"/>
    10. 机构代码:<input type="text" name="orgcode"/><br>
    11. <input type="submit" value="保存"/>
    12. form>
    13. body>
    14. 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. 用户代码:<input type="text" name="usercode" value="1234" disabled/>
    10. <input type="submit" value="保存"/>
    11. form>
    12. body>
    13. 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. <input type="text" maxlength="3"/>
    10. form>
    11. body>
    12. 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. <ul>
    9. <li>中国
    10. <ul>
    11. <li>北京li>
    12. <li>湖南li>
    13. ul>
    14. li>
    15. <li>日本li>
    16. <li>美国li>
    17. ul>
    18. <ol type="A">
    19. <li>水果li>
    20. <li>蔬菜li>
    21. <li>li>
    22. ol>
    23. body>
    24. html>
  • 相关阅读:
    通俗理解深度学习中的知识
    虾皮选品免费工具:如何用知虾进行虾皮市场分析选品
    Apollo 配置中心的部署与使用经验
    C# WPF入门学习主线篇(三十三)—— 使用ICommand实现命令绑定
    oled显示器程序(IIC)从stm32f103移植到stm32f429出现bug不显示-解决移植失败问题
    appinventor多个拓展导入导致编译出错:
    xgboost early_stop_rounds是如何生效的?
    06 flink 的各个角色的交互
    操作系统-《王道 操作系统》
    使用DockerCompose部署Redis分片集群——整合SpringBoot
  • 原文地址:https://blog.csdn.net/qq_62731133/article/details/127595942