链接如下

其实chrome是有这个东西的,那就是shadow DOM

什么是Shadow-DomShadow DOM是指浏览器的一种能力,它允许在文档(document)渲染时插入一棵DOM元素子树,但是这棵子树不在主DOM树中。它的最大的用处在于隔离外部环境用于封装组件。

比如说,我们正常写的输入框html代码是这样的:

<input name="password" maxlength="50" placeholder="请输入密码">

然后它就是可以完成内容输入,格式限制,字数限制等功能了。功能甚是强大,其实这个标签对于浏览器来说就是一个封装好的,可以隔离外部的组件。正常下,我们用chrome开发者工具,看到的和我们书写的代码差不多,其实里面内有乾坤,如果你想看到里面的乾坤,那就需要借助Shadow DOM。如何开启chrome的Shadow DOM功能呢?很简单,F12调出开发者工具,然后Settings → General → Elements → Show user agent shadow DOM来开启

开启后,你再回去看input的dom节点就能看到里面的结构啦: 

既然能看到里面的结构,而里面实际也是由各种dom节点组成的,自然也就可以看到应用做里面dom节点的样式啦~

转自:http://www.w3cmark.com/2016/502.html

input的placeholder字体大小无法修改?的更多相关文章

  1. css设置input中placeholder字体

    设置input中placeholder字体颜色 input::-webkit-input-placeholder {color:@a;} input:-moz-placeholder {color:@ ...

  2. 改变input的placeholder字体颜色

    改变input的placeholder字体颜色,注意哦,只是placeholder的字,用户输入的字不可以 input::-webkit-input-placeholder{ coloc:#000; ...

  3. 【纯代码】Swift-自定义PickerView单选(可修改分割线颜色、修改字体大小、修改字体颜色。)(可根据需要自己扩展)

    typealias PopPickerViewCallBackClosure = (_ resultStr:NSString?) -> () class PopPickerView : UIVi ...

  4. swift修改UITextfield的Placeholder字体大小和颜色

    第一种方法: self.userNumber.setValue(UIColor.lightGray, forKey: "_placeholderLabel.textColor") ...

  5. Eclipse设置问题:字体大小、修改注释内容、修改快捷键

    一.设置字体大小,看下图,包括了设计代码字体大小和控制台输出字体大小 二.修改注释内容 选择window---->>preferences 选择Java---->>code s ...

  6. 设置input标签placeholder字体颜色

    有时会遇到这样的需求,输入框的默认提示文字与用户输入的文字不同. <input className="city" placeholder="城市"/> ...

  7. css 修改placeholder字体颜色字体大小 修改input记住账号密码后的默认背景色

     壹 ❀ 引 本来这个阶段的项目页面都是给实习生妹子做的,我只用写写功能接接数据,但这两天妹子要忙翻译,这个工作阶段也快结束了导致有点慌,只能自己把剩余的几个小页面给写了. 那么做页面的过程中,UI也 ...

  8. input修改placeholder中颜色和字体大小

    input::-webkit-input-placeholder { /* placeholder颜色 */ color: #aab2bd; /* placeholder字体大小 */ font-si ...

  9. 解决input 中placeholder的那些神坑

    **昨天后台小哥哥提到placehold无法显示问题,我这边总结一下,顺便写个小文章分享给大家..** ============================================== 一 ...

随机推荐

  1. PHP中生成验证码

    //生成图片$im = imagecreatetruecolor(100,30);//生成颜色,当第一次调用生成颜色的方法,是生成背景颜色,默认是黑色//如果想自定义背景颜色,用到imagefill函 ...

  2. SufaceView(绘图类)

    public class MainActivity extends Activity { GrameView grameView; @Override public void onCreate(Bun ...

  3. CSS中文字体的英文名称 – 前台开发必备

    做什么用的?写过CSS的都晓得,一般用在font-family后面——为什么不用中文呢?有过一定开发经验的都晓得CSS里面用中文也是会乱码的,特别是没有中文字符集的浏览器,直接成了框框,用英文就可以解 ...

  4. .NET程序集1

    谈谈.NET程序集(一) 谈谈.NET程序集(一) The Assembly in .NET by 唐小崇 http://www.cnblogs.com/tangchong 在.NET出现之前, Wi ...

  5. Kendo UI开发教程(8): Kendo UI 特效概述

    Kendo UI Fx 提供了一个丰富,可扩展,性能经过优化的工具集合用来完成HTML元素的过渡显示.每种特效近可能的使用CSS Transition ,对于一些老版本浏览器使用修改属性的方法作为补充 ...

  6. Android 经验: 5555 端口会被 adb 误认为 emulator

    在本机启动 Android, 再用本机的的 adb 去连接 adb connect 127.0.0.1:5555 而后 adb devices 查看 user@ubuntu:~$ adb device ...

  7. linux apt-get 源配置

    linux中apt-get不能使用可能因为源不对,需要修改/etc/apt下的sources.list文件 apt-get源网上有很多,但是试了很多都不能用,以下提供一个我自己这边使用成功的源: de ...

  8. 设置代码ios 6添加日历事件No calendar has been set.错误

    查了好多资料,发明还是不全,干脆自己整理吧,至少保证在我的做法正确的,以免误导读者,也是给自己做个记录吧! 在iOS 6做日历事件添加时,来来回回报错,No calendar has been set ...

  9. Mutex 实现进程独占资源

    背景:开发一套依赖硬件运行的软件,为避免硬件资源调用冲突,一个时间内只允许运行一个软件进程. 方法:使用Mutex判断该软件是否已启动,如果是,关闭即将启动的软件. 代码: static class ...

  10. CPU内存管理和linux内存分页机制

    一.概念 物理地址(physical address)用于内存芯片级的单元寻址,与处理器和CPU连接的地址总线相对应.——这个概念应该是这几个概念中最好理解的一个,但是值得一提的是,虽然可以直接把物理 ...