1、扁平化的设计风格。--淘宝

 
直接使用input。对其设置height。padding。使鼠标居中又不会占满输入框。
 

 
 
2、背景是图片的设计。--百度
 
试用span将input包裹起来。span设置背景。input设置margin。使用-webkit-appearance:none去除系统的默认样式（主要是在iphone上）。
 

文本输入框的两种div+css的写法的更多相关文章

  1. JavaWeb后台从input表单获取文本值的两种方式

    JavaWeb后台从input表单获取文本值的两种方式 #### index.html <!DOCTYPE html> <html lang="en"> & ...

  2. 鼠标经过图片时变换的两种方法--css+div及javascript应用

    javascript方式:    熟悉使用document.getElementById()取得节点对象 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...

  3. 两种纯CSS方式实现hover图片pop-out弹出效果

    实现原理 主要图形的组成元素由背景和前景图两个元素,以下示例代码中,背景元素使用伪元素 figure::before 表示, 前景元素使用 figure img 表示,当鼠标 hover 悬浮至 fi ...

  4. 在ASP.Net中两种利用CSS实现多界面的方法

    通过使页面动态加载不同CSS实现多界面(类型于csdn的blog): 方法一: <%@page language="C#"%><%@import namespac ...

  5. WPF TextBlock 文本换行的两种方式

    第一种: <TextBlock> This is line 1.<LineBreak/> This is line 2. </TextBlock> 第二种 < ...

  6. Android Edittext聚焦时输入法挡住了EditText输入框的两种解决方案

    方案一.把整个布局文件用ScrollView套住.这样当你聚焦时虽然输入法也能够挡住一些输入框,但是你可以通过手动滑动看被挡住的内容. 方案二.在Activity中设置android:windowSo ...

  7. Mysql的两种“超过多少次”写法（力扣596）

    题目: 有一个courses 表 ,有: student (学生) 和 class (课程). 请列出所有超过或等于5名学生的课. 例如,表: +---------+------------+ | s ...

  8. 【JavaScript】两种常见JS面向对象写法

    基于构造函数 function Circle(r) { this.r = r; } Circle.PI = 3.14159; Circle.prototype.area = function() { ...

  9. Div+Css布局教程（-）CSS必备知识

    目录: 1.Div+Css布局教程(-)CSS必备知识 注:本教程要求对html和css有基础了解. 一.CSS布局属性 Width:设置对象的宽度(width:45px). Height:设置对象的 ...

随机推荐

  1. HQL查询

    HQL ,Hibernate Query Language ,是Hibernate查询语言,不直接操作数据表,而是操作实体类,根据实体类和对应数据表中的映射关系,查找数据. 下面是hql的基本步骤: ...

  2. Sql Server 2008清理数据库日志的语句

    USE [master]GOALTER DATABASE DNName SET RECOVERY SIMPLE WITH NO_WAITGOALTER DATABASE DNName SET RECO ...

  3. SqlServer 开启或关闭数据库主键自增

    可用作删除一行主键数据库,在还原数据行,或者删掉后,被伤处的主键还可以利用 --开启当前表的可复制功能,仅在当前回话中有效 SET IDENTITY_INSERT  dbo.PDAUserInfo O ...

  4. 干货--微信公众平台客户端调试工具-初试WPF开发

    本工具可以由任意一个开发微信公众平台的开发者使用,虽然它本身使用WPF(C#)开发的,但是并不受你想调试的服务所用的语言的影响. 之前一直在做微信公众平台开发,客户端调试是必须做的事情,一直以来都是用 ...

  5. DG下手工处理v$archive_gap方法

    从9i以后,oracle dataguard 备库一般都不需要手工处理丢失的日志,FAL自动会帮我们处理,下面通过个案例来讲下手工处理丢失的日志的方法: 1.在备库查询有哪些日志丢失,没应用到备库 S ...

  6. ORA-02095: specified initialization parameter cannot be modified

    输入命令:alter system set utl_file_dir='/home/oracle/logmnr' scope=spfile; 报错: 出错原因:没有用spfile文件启动数据库 解决办 ...

  7. javascript 字符串转为对像函数eval("string")

    javascript有一个很有用的函数eval("string")这个函数可以把字符串转换为对象或者可以执行的语句,例如你的代码可以用obj2=eval("documen ...

  8. C#构造函数使用

    作用:帮助我们初始化对像(给对像的每个属性依次的赋值) 构造函数是一个特殊的方法 1.构造函数没有返回值,连void也不能写 2.构造函数名称要和类名一样 3.创建对像时会执行构造函数 4.构造函数可 ...

  9. OpenCV——改变图像大小

    , , int interpolation=INTER_LINEAR ) dsize与fx和fy必须不能同时为零,也就是说要么dsize不为零而fx与fy同时可以为0,要么dsize为0而fx与fy不 ...

  10. Hdu1097（计算a的b次幂最后一位数值）

    #include <stdio.h> #include <math.h> int main() { int Num1,Num2; while(scanf("%d %d ...