前端 html  input标签 的placeholder属性  标签上显示内容

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div style="width: 600px;margin: auto">

        <input  type="text" placeholder="请输入关键字">

    </div>

</body>

</html>

一输入文本内容 没有了

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="x-ua-compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Title</title>

</head>

<body>

    <div>

        <form>

            <div>

                <label for="user">用户名:</label>

                <input id="user" name="username" type="text" placeholder="请输入用户名">

            </div>

            <div>

                <label for="pwd">密码:</label>

                <input id="pwd" name="password" type="password" placeholder="请输入密码">

            </div>

        </form>

    </div>

</body>

</html>

前端 html input标签 placeholder属性 标签上显示内容的更多相关文章

  1. input 的 placeholder属性在IE8下的兼容处理

    placeholder是input标签的新属性,在使用的时候有两个问题: 1.IE8 下不兼容 处理思路: 如果浏览器不识别placeholder属性,给input添加类名placeholder,模仿 ...

  2. Hmtl5 <input>中placeholder属性（新属性）

    Hmtl5 <input>中placeholder属性(新属性) 一.定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示 ...

  3. iview+vue 表格任一项实现鼠标划上显示内容

    在新版本的iview中,表格新增了tooltip功能: 但做项目时并不是新的iview版本,又不想升级,如何才能实现当内容过多鼠标划上显示内容?下边是我做项目时的改动: { // fixed: 'le ...

  4. 解决input标签placeholder属性浏览器兼容性问题的一种方法

    为文本框input添加文字输入提示,H5为input提供了一个placeholder属性.在支持H5的浏览器中,用此属性设置输入提示,简单方便,但是对于IE8以下版本,都不支持placeholder属 ...

  5. 修改 input / textarea placeholder 属性的颜色和字体大小

    话不多说,直接上代码: input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #666; fon ...

  6. 前端 HTML form表单标签 input标签 type属性 file 上传文件

     加上上传文件功能 input type='file' - 依赖form表单里一个属性 enctype="multipart/form-data" 加上这个属性表示把你上次文件一点 ...

  7. ie6下使用js替换img标签src属性图片不显示的错误

    首先,我必须再次强调一下,F-U-C-K I-E! 其次,简单阐述一下这个bug的出现的情况.页面中有个<a href=”javascript:void(0)” onclick=”swapImg ...

  8. ie8不兼容input的placeholder属性但是要实现其效果的方法

    通过学习前辈的思想,个人想法整理如下: 通过两个元素标签,仿造出placeholder的内容 使用position定位好两个元素标签 第一要隐藏两个元素标签display:none,在<!--[ ...

  9. angular自定义指令解决IE89不支持input的placeholder属性

    下面代码实测通过,直接copy到本地运行即可. <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...

随机推荐

  1. 《转载》图解Tomcat类加载机制

    本文转载自http://www.cnblogs.com/xing901022/p/4574961.html 说到本篇的tomcat类加载机制,不得不说翻译学习tomcat的初衷. 之前实习的时候学习j ...

  2. 【python3】基于 qq邮箱的邮件发送

    脚本内容: #!/usr/bin/python3 # -*- coding: UTF-8 -*- import smtplib from email.mime.text import MIMEText ...

  3. Web服务器配置Gzip压缩提升网站性能

    前言: HTTP协议上的GZIP编码是一种用来改进WEB应用程序性能的技术.大流量的WEB站点常常使用GZIP压缩技术来让用户感受更快的速度.这一般是指WWW服务器中安装的一个功能,当有人来访问这个服 ...

  4. html2canvas - 解决办法之图片跨域导致的截图空白

    1. 后端支持:图片要是cdn上的地址,并且允许图片跨域,header头中设置应为 Access-Control-Allow-Origin:  * 2. 前端配置 var opts = { scale ...

  5. Android6.0中PowerManagerService分析

    转自:http://blog.chinaunix.net/xmlrpc.php?r=blog/article&uid=30510400&id=5569393 概述 一直以来,电源管理是 ...

  6. Android.mk (2) 函数进阶教程 - 分支、循环、子程序

    https://www.jianshu.com/p/674dc7d7b4b0 函数进阶教程 - 分支.循环.子程序 按照面向过程程序设计的标准流程,我们讲完了顺序结构,就要讲分支.循环和子程序.下面我 ...

  7. 重新签名IOS .ipa文件 (包含第三方框架和插件)

    本文未经测试,初步看代码流程接近本人想法,留下作记录.Intoduction This code allow you to resign your own ipa assuming that you ...

  8. 部署OpenStack问题汇总（五）--openstack中删除虚拟主机，状态一直未deleting

    [原创文章,转载请注明出处] 一.我重启了该机器,之后想删除没有创建成功的虚拟机(没有打开cpu的vt),结果发现状态一直为deleting状态.在这个状态下创建虚拟机也失败. 二.分析:在/var/ ...

  9. Jenkins常见任务配置

    一.pmd 二.checkstyle -DskipTests=true clean compile package -Dcheckstyle.config.location="custom- ...

  10. shell脚本技巧记录

    2014/4/9 shell脚本变量处理: ${varible##*string} //从左向右截取最后一个string后的字符串 ${varible#*string} //从左向右截取第一个stri ...