Home>Article>Web Front-end> CSS implements a simple flat button

CSS implements a simple flat button

王林
王林 forward
2020-09-18 17:43:33 3394browse

CSS implements a simple flat button

Let’s take a look at the button style first:

(Recommended tutorial:CSS tutorial)

CSS implements a simple flat button

Specific code:

 //js写法 $("#btn").css({ "font-family": "'微软雅黑','Helvetica Neue',Helvetica,Arial,sans-serif", "font-size": "13px!important", "height": "30px", "line-height": "18px!important", "padding": "3px 18px", "display": "inline-block", "vertical-align": "middle", "font-weight": "normal", "border-radius": "2px", "margin": "0 8px 0 3px", "border": "1px solid #3383da", "color": "#ffffff", "background-color": "#3383da" }); //css写法 #btn{ font-family: "'微软雅黑','Helvetica Neue',Helvetica,Arial,sans-serif"; font-size: 13px!important; height: 30px; line-height: 18px!important; padding: 3px 18px; display: inline-block; vertical-align: middle; font-weight: normal; border-radius: 3px; margin: 0 8px 0 3px; border: 1px solid #3383da; color: #ffffff; background-color: #3383da; cursor: pointer; }

The above is the detailed content of CSS implements a simple flat button. For more information, please follow other related articles on the PHP Chinese website!

css
Statement:
This article is reproduced at:csdn.net. If there is any infringement, please contact admin@php.cn delete