温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

CSS中怎么创建图像图标按钮

发布时间:2022-02-24 13:52:44 来源:亿速云 阅读:116 作者:小新 栏目:web开发

这篇文章主要介绍CSS中怎么创建图像图标按钮,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

  在按钮表面上显示图像图标时,请写代码以在按钮标签中显示图像,实现此效果要使用显示设置为内联块的span标记。

  代码如下:

  image-button.css

  #buttonImage{

  background-image:url('/img/search.png');

  display:inline-block;

  margin-top:2px;

  width:16px;

  height:16px;

  }

  .flatbutton{

  border:1pxsolid#3079ed;

  background-color:#4d90fe;

  width:100px;

  height:28px;

  }

  image-button.html

  <!DOCTYPEhtml>

  <html>

  <head>

  <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>

  <title></title>

  <linkrel="stylesheet"type="text/css"href="image-button.css"/>

  </head>

  <body>

  <buttonclass="flatbutton"><spanid="buttonImage"></span></button>

  </body>

  </html>

CSS中怎么创建图像图标按钮

以上是“CSS中怎么创建图像图标按钮”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css
AI