前端 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. Push rejected: Push master to origin/master was rejected /failed to push some refs to /git did not exit cleanly

    用studio提交代码报 Push rejected: Push master to origin/master was rejected 用TortiuseGit提交代码报下面错,(我是用这种方法解 ...

  2. 使用es6的蹦床函数解决递归造成的堆栈溢出

      首先,我们先定义一个函数,使用递归的思想写求和的方法: function sum(x, y) { if (y > 0) { return sum(x + 1, y - 1); } else ...

  3. 适配器模式（PHP实现）

    [目的]:将一个类的接口转换成客户希望的另外一个接口,Adapter模式使得原来由于接口不兼容而不能一起工作的那此类可以一起工作 [主要角色]目标(Target)角色:定义客户端使用的与特定领域相关的 ...

  4. HipHop的原理

    HipHop的原理 HipHop将PHP代码转换为高度优化的C++代码,然后再用g++编译器编译.它可以保持语义等效地执行源代码,但为了提高性能,牺牲了一些很少用到的特性,比如eval(). HipH ...

  5. 文件系统的挂载(2)---挂载rootfs文件系统

    一.目的 本文主要讲述linux内核rootfs文件系统的挂载过程,内核版本为3.10. rootfs是基于内存的文件系统,没有实际的存储设备,所有操作都在内存中完成.为了保证linux内核的精简性, ...

  6. SQL Server设置登录验证模式

    我们在安装SQL Server的时候可以设置“混合验证模式”,既可以使用windows身份验证登录,也可以使用SQL Server身份验证登录. 如果我们在安装的时候并未设置"混合验证模式& ...

  7. Android studio Unable to start the daemon process

    Unable to start the daemon process.This problem might be caused by incorrect configuration of the da ...

  8. 利用按钮打开tabBar页面

    场景:当tabBar上有个人中心的时候,这里假设需要登陆才可以看到个人中心A页面,在A页面onload中先判断是否登陆,如果没有登陆就跳转到登陆页面B,待输入用户名和密码,点击登陆按钮后再跳转到A页面 ...

  9. CSS+transform画动态表情

    先给大家看下画完后是什么样子: 代码看这里: html代码: <body> <div class="emoji emoji_like"> <div c ...

  10. mysql explain分析

    通过explain可以知道mysql是如何处理语句,分析出查询或是表结构的性能瓶颈.通过expalin可以得到: 1. 表的读取顺序 2.表的读取操作的操作类型 3.哪些索引可以使用 4. 哪些索引被 ...