Flat css3 modern buttons

Developer
Mario Loncarek
Size
1,832 Kb
Views
50,600
  1. Flat css3 modern buttons Previews
  2. Flat css3 modern buttons HTML Codes
  3. Flat css3 modern buttons CSS Codes

How do I make an flat css3 modern buttons?

This kind of buttons are popular these days. What is a flat css3 modern buttons? How do you make a flat css3 modern buttons? This script and codes were developed by Mario Loncarek on 03 July 2022, Sunday.

Flat css3 modern buttons Previews
IQ Test

Flat css3 modern buttons - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Flat css3 modern buttons</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <link href='http://fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet' type='text/css'>
<a href="#" class="button">Button</a>
<br><br><br><br>
<a href="#" class="button2">Button</a>
</body>
</html>

Flat css3 modern buttons - Script Codes CSS Codes

body{ background: url('http://s10.postimg.org/hp1l14hi1/blurry_blue_background_wallpaper_2560x1600.jpg'); background-size: 100%;
}
.button{ position: relative; overflow: visible; display: inline-block;	border:1px solid #fff;	border-radius:6px;	-webkit-border-radius: 6px;	-moz-border-radius: 6px;	padding:1em 2em 1em;	line-height:1; background:transparent; text-decoration:none; font-family: 'Raleway', sans-serif; font-weight:100; color:#fff; font-size:20px;
}
.button:hover{ border:1px solid #e74c3c; transition-property:border .1s linear 0s;	-moz-transition:border .1s linear 0s;	-webkit-transition:border .1s linear 0s;	-o-transition:border .1s linear 0s;
}
.button2{ position: relative; overflow: visible; display: inline-block;	border:1px solid #fff;	border-radius:6px;	-webkit-border-radius: 6px;	-moz-border-radius: 6px;	padding:1em 2em 1em;	line-height:1; background:#fff; text-decoration:none; font-family: 'Raleway', sans-serif; font-weight:100; color:#000; font-size:20px;
}
.button2:hover{ background:transparent; color:#fff; transition-property:background .1s linear 0s;	-moz-transition:background .1s linear 0s;	-webkit-transition:background .1s linear 0s;	-o-transition:background .1s linear 0s;
}
Flat css3 modern buttons - Script Codes
Flat css3 modern buttons - Script Codes
Home Page Home
Developer Mario Loncarek
Username riogrande
Uploaded July 03, 2022
Rating 3
Size 1,832 Kb
Views 50,600
Do you need developer help for Flat css3 modern buttons?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Mario Loncarek (riogrande) Script Codes
Name
Responsive full width carousel with owl-carousel
Responsive overlay menu - full menu with second menu example
Responsive overlay menu - rows menu example
IOs 7 phone screen
Learning ajax
Responsive overlay menu - full menu example
Buttons with icons made easy - with font awesome
Responsive overlay menu - button close only example
Responsive carousel with hover effects - owl carousel
Responsive navigation mobile menu toggle
Create amazing art & images with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!