How to create button in CSS?

by joe.haley , in category: HTML/CSS , 2 years ago

How to create button in CSS?

Facebook Twitter LinkedIn Telegram Whatsapp

2 answers

Member

by jamel , 2 years ago

You can create button in CSS like this:


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
<style>
        .button
     {
         background:violet;
         color: white;
         padding: 16px 32px;
         text-align: center;
         font-size: 16px;
         cursor: pointer;
         border-radius: 15px;
     }

    </style>
</head>
<body>
    <input type="button" class="button" value="Click">
</body>


by heloise_franecki , a year ago

@joe.haley  To create text buttons first, we create simple buttons in HTML. After creating the button we apply CSS and change its properties


HTML

1
2
3
4
<button>Default Button</button>
<a href="#" class="button">Link Button</a>
<button class="button">Button</button>
<input type="button" class="button" value="Input Button">


CSS

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
.button {
  background-color: #4CAF50;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}