找回密码立即注册

QQ登录

查看: 42808|回复: 0
收起左侧

[HTML] HTML按钮美化代码

[复制链接] [查看百度是否已收录此帖]

升级   100%

5280

主题

5718

帖子

15万

积分

管理员

李海18298346873

Rank: 9Rank: 9Rank: 9

积分
159098

推广达人宣传达人突出贡献优秀版主荣誉管理论坛元老

QQ
菜鸟站长联盟 发表于 2021-3-23 16:45:58 | 显示全部楼层 |阅读模式
菜鸟站长联盟VIP会员
  • 欢迎大家加入菜鸟站长联盟VIP会员 ☞ 点击查看详情
  • 我是菜鸟站长联盟草根站长李海 微信:18298346873
  • 致力于为企业提供优秀的网站建设解决方案,建站服务、网站优化、网站运营、网站托管、网站推广!
  • 致力于为个人提供优秀的网站建设培训课程,建站服务、网站优化、网站运营、域名空间、插件模板!
  • —————————————————————————————————————————————————
  • 菜鸟站长联盟站长李海微信

    本帖子中包含更多资源!

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    html bottom按钮html submit按钮控件html表单按钮控件-html bottom与html submit按钮表单控件与CSS美化,介绍form input bottom按钮和html input submit按钮基本结构与用法,html按钮控件bottom和submit区别,同时DIVCSS5对html按钮美化布局。


    一般提交按钮使用了html submit和html bottom两种按钮控件实现同时可将按钮设置CSS样式美化为时间设计图片按钮,首先DIVCSS5介绍html按钮基本语法结构与用法,DIVCSS5再对按钮进行图片美化布局。
    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <title>submit按钮美化 在线演示-www.nbabbc.com</title>
    5. <!-- www.nbabbc.com -->
    6. <style>
    7. html { width:100%; height:100%; }
    8. body { background:#fff; font-size:18px; font-family:"Arial", "Tahoma", "微软雅黑", "雅黑";
    9. line-height:18px; padding:0; margin:0; text-align:center; }
    10. div { padding:18px }
    11. img { border:0px; vertical-align:middle; padding:0px; margin:0px; }
    12. input, button { font-family:"Arial", "Tahoma", "微软雅黑", "雅黑"; border:0;
    13. vertical-align:middle; margin:8px; line-height:18px; font-size:18px }
    14. .btns { width:143px; height:40px; background:url("http://www.divcss5.com/uploads/allimg/1309/1_130916141906_1.jpg") no-repeat left top; color:#FFF; }
    15. </style>
    16. </head>
    17. <body>
    18. <p>
    19. <form id="form1" name="form1" method="" action="http://www.divcss5.com/" target="_blank">
    20. <div>
    21. <input type="submit" class="btns" onmouSEOver="this.style.backgroundPosition='left -40px'"
    22. onmouseout="this.style.backgroundPosition='left top'" value="提交" />
    23. </div>
    24. </form>
    25. </p>
    26. </body>
    27. </html>
    复制代码



    上一篇:HTML+CSS 鼠标放在文字上弹出一幅图片
    下一篇:HTML按钮添加跳转链接的代码
    零基础学习网站建设,上菜鸟站长联盟就够了!你与成功只差添加一个好友:微信18298346873
    *滑块验证:
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则








    QQ| 百度统计|小黑屋|菜鸟站长联盟 ( 陇ICP备15000550号-2 )|

    GMT+8, 2021-4-21 06:35 , Processed in 0.118836 second(s), 42 queries .

    快速回复 返回顶部 返回列表