html +css 登陆框中加用户图片,并设置登陆名不盖住图标

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8
 9 <div style="height: 600px;width: 1500px;border: 1px solid darkgray;margin: 0 auto;margin-top: 200px">
10     <div style="width: 400px;height: 35px;position: relative;margin: 0 auto;margin-top: 300px">
11
12         <input type="text" style="width: 370px;height: 35px;padding-right: 30px">
13
14         <span style="background-image: url(i_name.jpg);width: 16px;height: 16px;display: inline-block;position: absolute;top: 11px;right: 1px"></span>
15
16     </div>
17
18 </div>
19
20 </body>
21 </html>

注意:

<input type="text" style="width: 370px;height: 35px;padding-right: 30px">这句话中padding-right 让输入框往右移动30像素  宽度缩小30像素 加起来仍然是400像素 和div的像素一样大 但用户输入的字符就不会盖住我们右边那个小人的图标了

原文地址:https://www.cnblogs.com/topzhao/p/9170411.html

时间: 2024-10-18 10:06:42

html +css 登陆框中加用户图片,并设置登陆名不盖住图标的相关文章

android优化从网络中加载图片速度。。

从网络中加载图片主要要注意两个方面的问题: 1.内存管理:图片占的内存很大,假如图片数量多,很容易让系统抛出out of memory的异常. 同时我们也要注意不同android版本中内存管理的区别. 2.性能:图片的加载速度,和加载图片时不影响UI的流畅性 尤其是在ViewPager,GridView 和ListView等等需要在短时间内加载大量图片时,上面两个问题就更加突出了... 要解决上面这个两个问题,我们要用到的技术 1.缩减加载的图片的bitmap 可以通过实现显示图片的view的大

Android设置Notification从网络中加载图片,解决点击无法消失的bug

Notification的构造函数中只支持使用资源文件的图片作为图片,但是如果我们想用网络中的图片怎么办呢. 我们知道,给Notification设置内容的时候调用的是setLatestEventInfo方法,当我们点击去看该方法的时候,所有的结果都一目了然了. public void setLatestEventInfo(Context context, CharSequence contentTitle, CharSequence contentText, PendingIntent con

改变checkbox的样式(选项框中加图片)

input[type='checkbox'] { width: 20px; height: 20px; background-color: #fff; -webkit-appearance: none; border: 1px solid #c9c9c9; border-radius: 2px; outline: none; } .li_ipt input[type=checkbox]:checked { background: url("img/ok.png")no-repeat c

el-table中加载图片问题

<el-table-column label="头像" width="100"> <template scope="scope"> <img :src="scope.row.img" width="50" height="50" class="img"/> </template> </el-table-column

xcode 7.2 怎么在Playground 中加载图片

在Playground文件所在里的地方 如果忘记保存到哪里了 Show File Inspector 可以打开面板 上面有一个Full Path 就是文件路径 (点击右下角小箭头就会直接打开了) 右键点击name.playgournd 文件-> 显示包内容 这里如果没有Resources 这个文件夹 就创建一个 然后在里面添加的图片就可以用了 在 Image Asset 的面板上也可以看的到了 纯原创 转载请注明

通过给事件处理程序传递this参数,获取事件源对象的引用。单机提交按钮时在信息框中显示用户输入的字符。

<script> function mymethod(str) { alert("您输入的是:"+str); } </script><form action="" method="get"><!-- 调用mymethod()函数this.value取得当前对象的值做参数 --><input type="text" name="text" onchange

高效地加载图片(五) 将图片展示在UI中

这篇文章将前几篇使用的方法进行了整合,让我们能够在后台线程中加载以及缓存图片并在ViewPager和GridView中展示出来,并在这些过程中处理并发以及参数的设置. 将图片加载到ViewPager中 使用滑动视图来对图片详情进行导航是一种不错的方式.我们可以使用ViewPager和PagerAdapter来实现.但是,使用FragmentStatePagerAdapter可能会更好,它能够自动地保存ViewPager中Fragment的状态并控制它的创建和销毁,能够有效地利用内存. 注意:如果

ios开发中如何选择图片的加载方式

第一种方法:imageNamed:   (经常会重复使用的图标 用这个,图片不大的) 为什么有两种方法完成同样的事情呢?imageNamed的优点在于可以缓存已经加载的图片. 这种方法会首先在系统缓存中根据指定的名字寻找图片,如果找到了就返回.如果没有在缓存中找到图片,该方法会从指定的文件中加载图片数据,并将其缓存起来,然后再把结果返回.对于同一个图像,系统只会把它Cache到内存一次,这对于图像的重复利用是非常有优势的.例如:你需要在 一个TableView里重复加载同样一个图标,那么用ima

Android之批量加载图片OOM问题解决方案

一.OOM问题出现的场景和原因 一个好的app总少不了精美的图片,所以Android开发中图片的加载总是避免不了的,而在加载图片过程中,如果处理不当则会出现OOM的问题.那么如何彻底解决这个问题呢?本文将具体介绍这方面的知识. 首先我们来总结一下,在加载图片过程中出现的OOM的场景无非就这么几种: 1.  加载的图片过大 2.  一次加载的图片过多 3.  以上两种情况兼有 那么为什么在以上场景下会出现OOM问题呢?实际上在API文档中有着明确的说明,出现OMM的主要原因有两点: 1.移动设备会