HTML&CSS基础学习笔记1.25-input标签的选择文件和隐藏元素

最新推荐文章于 2022-12-22 18:16:08 发布

iteye_5032

最新推荐文章于 2022-12-22 18:16:08 发布

阅读量117

点赞数

分类专栏： HTML 文章标签：前端 ViewUI

HTML 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

选择文件

<input>标签的[type]属性值为"file"时，表示文件选择控件，右侧的页面添加了一个文件选择控件，您可以尝试为网页添加一个文件。

我们可以用这个标签来实现上传头像，上传附件等功能。

[html]view plaincopy
        
    
<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <link rel="stylesheet" type="text/css" href="index.css">  
    <title>表单</title>  
</head>  
<body>  
<form action="/" method="get">  
    <h2>input标签 -- 选择文件</h2>  
    <p><input type="file" id="file"/></p>  
</form>  
</body>  
</html>  

这段代码就可以实现（伪）文件上传选择的功能：

隐藏元素

有时候我们编写前端代码的时候，可能需要把一些数据告诉后台，但是这些数据又不想让用户看到，我们可以设置<input>标签的[type]属性为"hidden"。

<input>的[type]属性值为"hidden"表示隐藏输入域。

这种类型的输入标签是看不见的，但是是真实存在的。这个不可见的标签的 [value] 属性保存了一个要提交给 Web 服务器的任意字符串。如果想要提交并非用户直接输入的数据的话，可以使用这种类型的<input>标签。

[html]view plaincopy
        
    
<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <link rel="stylesheet" type="text/css" href="index.css">  
    <title>表单</title>  
</head>  
<body>  
<form action="/" method="get">  
    <h2>input标签 -- 隐藏元素</h2>  
    <p><input type="hidden" id="hidden"/></p>  
</form>  
</body>  
</html>  

看看这段代码，是不是有个东西不见了？？

更多学习内容，就在码芽网http://www.mayacoder.com/lesson/index

iteye_5032

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML&CSS基础学习笔记1.25-input标签的选择文件和隐藏元素

选择文件&lt;input&gt;标签的[type]属性值为"file"时，表示文件选择控件，右侧的页面添加了一个文件选择控件，您可以尝试为网页添加一个文件。我们可以用这个标签来实现上传头像，上传附件等功能。 [html] view plain copy &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt;...
复制链接

扫一扫