input如何添加图标

2025-05-13 21:49:21

1、打开html开发软件,新建一个html页面。如图:

input如何添加图标

3、设置class类属性,添加小图标。创建<style>标签,然后在这个标签里面设置user样式。 1.使用background-image设置input背景图片; 2.background-size设置背景图片的大小; 3.background-position设置背景图片的位置; 4.background-repeat设置背景图片不重复; 5.padding设置图片的内边距。css样式代码:<style type="text/css"> .user{ background-image: url(img/user.png);/*设置小图标*/ background-size: 25px 25px;/*小图标的大小*/ background-position: 5px 4px;/*小图标在input的位置*/ background-repeat: no-repeat;/*背景小图标不重复*/ padding: 8px 10px 8px 40px;/*设置input内边距*/ /*设置input样式好看*/ border:1px solid #ddd; margin: 30px; width: 220px; } </style>

input如何添加图标
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢