语义化的label？
作者：aoao 来源：样式之美 发布时间：2009-02-11 12:44:00
标签：label,语义化,标签,文字,css
大家应该经常看到在文本框里提示文字，然后一点就没了。通常做法都是默认给个value，通过js来处理。详细实现都不介绍了，大家都会。现在来看一下一个比较创意的实现。
就是直接用label的内容盖在input上面，然后用js来处理一下。详细实现就不用说了，反正我想尝试纯CSS是没办法实现滴。从结构上来看，还是比较理想的，充分利用了label
<label id="usernameLabel" for="username" class="placeholder"><span>Member Name</span></label> <input id="username" name="username" class="text" type="text" maxlength="128" value="" />
其实看图看不出什么，点图去网站看一下。
我还特别试了一下noscript的效果，跳转 囧rz。
有些细节的，比如提示文字从灰变得更灰的过渡效果，是-webkit-transition的应用，要用webkit的浏览器才能体现。
再其实，input有个叫placeholder的属性，参考以前类型为search的input及相关属性，可以直接用在type="text"的input上，不过哪种方式在哪些情况应用会更适合呢，大家自己决定吧。
0
投稿猜你喜欢
- dataclass语法一、 简介官方文档的地址为：https://docs.python.org/3.9/library/dataclass
前言Typora是一款非常使用的笔记工具，对于程序员非常友好，在2021年11月23日，Typora 正式发布 1.0 版本，进入了付费时代- 微信应用号（微信公众平台小程序，「应用号」的新称呼）终于来了！开源中国社区的博卡君通宵吐血赶稿写出的微信公众平台应用号开发教程！大家赶紧来学
- jQuery获取Select选择的Text和Value: $("#select_id").change(function
- 快排是python经典算法之一。1、下面讲解的是什么是快排和快排的图示。2、快排是一种解决排序问题的运算方法。3、快排的原理：在数组中任意选
- Cookie 模块，顾名思义，就是用来操作Cookie的模块。Cookie这块小蛋糕，玩过Web的人都知道，它是Server与Client保
- PHP 有一个非常简单的垃圾收集器，它实际上将对不再位于内存范围（scope）中的对象进行垃圾收集。垃圾收集的内部方式是使用一个引用计数器，
- 目录selenium介绍selenium原理Selenium安装部署步骤1. 准备好python环境：2. 下载selenium并安装：3.
- 在SQL Server 配置管理器中，展开SQL Server 2005的网络配置，然后点击服务器实例如：MSSQLSERVER 的协议。
- 前言最近项目中遇到一个用于监控日志文件的Python包pyinotify，结合自己的项目经验和网上的一些资料总结一下，总的原理是利用pyin
- 在数据库中，对性能影响最大的包括数据库的锁策略、缓存策略、索引策略、存储策略、执行计划优化策略。索引策略决定数据库快速定位数据的效率，存储策
- 使用requests下载文件1、获取token，或者session如不需要可忽略login_url = "http://xxxx/
- 主页上的鼠标是不是就只有箭头和小手两种模样呢？如果鼠标移到“帮助”等字样上时，形状就变成求助的问号；鼠标移到可能需要较长时间等待的超链接时，
- 被AJAX中DOM的操作郁闷了好几天，今天总算搞明白了，自学就是苦啊，苦的一把鼻涕一把泪的，把教训些出来，给后来者提个醒，老鸟就不要看了。下
- 1.使用测量工具，量化性能才能改进性能，常用的timeit和memory_profiler，此外还有profile、cProfile、hot
- 本文实例讲述了Python实现的寻找前5个默尼森数算法。分享给大家供大家参考，具体如下：找前5个默尼森数。若P是素数且M也是素数，并且满足等
- 问题描述最近产品提出一个需求，说是做表格呈现统计数据，不过数据源是来自两个地方的，所以需要做两个表格去呈现数据，同时在表格最后统计数据。效果
- 需求：查询表dbo.Message，每页10条，查询第2页1:TOP（）SELECT TOP(20) * FROM dbo.Message
- 0.配置依赖环境，如果不进行这步可能会出现一些问题中间可能有多余空格，去除下再运行，一般都能安装成功，如果不能可以先更新下sudo apt-
- 一、定位元素的8种方式1、方法介绍定位一个元素定位多个元素含义find_element_by_id()find_elements_by_id
