diff --git a/Css/btn.css b/Css/btn.css new file mode 100644 index 0000000..dcdd4fa --- /dev/null +++ b/Css/btn.css @@ -0,0 +1,99 @@ +.btn{ + text-align:center; + margin:0 auto; +} +.btn-square { + display: inline-block; + padding: 0.5em 1em; + text-decoration: none; + background:#FF4500;/*????*/ + color: #FFF; + border-bottom: solid 4px #800000; + border-radius: 3px; +} +.btn-square:active { + /*?????????*/ + -webkit-transform: translateY(4px); + transform: translateY(4px);/*????*/ + border-bottom: none;/*????*/ +} + +.btn-circle-border-simple4:hover { + background: #CD5C5C; +} + +.btn-circle-border-simple1 { + display: inline-block; + text-decoration: none; + color: #9933FF; + width: 100px; + height: 100px; + line-height: 100px; + border-radius: 50%; + border: solid 2px #9933FF; + text-align: center; + overflow: hidden; + font-weight: bold; + transition: .4s; +} + +.btn-circle-border-simple1:hover { + background: #CC99FF; +} + +.btn-circle-border-simple2 { + display: inline-block; + text-decoration: none; + color: #003366; + width: 100px; + height: 100px; + line-height: 100px; + border-radius: 50%; + border: solid 2px #003366; + text-align: center; + overflow: hidden; + font-weight: bold; + transition: .4s; +} + +.btn-circle-border-simple2:hover { + background:#3399FF ; +} + +.btn-circle-border-simple3 { + display: inline-block; + text-decoration: none; + color:#00CC00 ; + width: 100px; + height: 100px; + line-height: 100px; + border-radius: 50%; + border: solid 2px #00CC00; + text-align: center; + overflow: hidden; + font-weight: bold; + transition: .4s; +} + +.btn-circle-border-simple3:hover { + background: #66FF66; +} + +.btn-circle-border-simple4 { + display: inline-block; + text-decoration: none; + color:#8B0000 ; + width: 100px; + height: 100px; + line-height: 100px; + border-radius: 50%; + border: solid 2px #8B0000; + text-align: center; + overflow: hidden; + font-weight: bold; + transition: .4s; +} + +.btn-circle-border-simple4:hover { + background: #CD5C5C; +}