Sunday, October 24, 2021

Html Button With CSS Padding Style

 Html Button With CSS Padding Style Code

<!DOCTYPE html>

<html>

    <head>

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

         <link rel="STYLESHEET"type="text/css"href="web.css">

        <title>web design</title>

    </head>

    <body>

     <h1>CSS Button</h1>

     <button class="button button1">10px 24px</button>

     <button class="button button2">12px 20px</button>

     <button class="button button3">14px 40px</button>

     <button class="button button4">32px 15px</button>

     <button class="button button1">16px</button>


    </body>

</html>


CSS Padding Style Code

.button{

    background-color: green;

    border: none;

    color: #fff;

    text-align: center;

    text-decoration: none;

    display: inline-block;

    font-size: 16px;

    margin:4px 2px;

    cursor: pointer;

}

.button1{padding:10px 24px ;}

.button2{padding:12px 20px;}

.button3{padding:14px 40px ;}

.button4{padding:32px 15px ;}

.button5{padding:16px ;}

No comments:

Post a Comment

JavaScript Animated

  JavaScript Animated <!DOCTYPE html> <html> <style> #myContainer {   width: 400px;   height: 400px;   position: relative;...