css實現圓角按鈕效果
分享一段程式碼例項,它實現了圓角按鈕效果。
並且此按鈕帶有陰影效果,程式碼例項如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style> button { width: 140px; height: 40px; background: green; border: 1px solid green; border-radius: 10px; color: #ffffff; box-shadow: 7px 15px 15px gray; } </style> </head> <body> <button type="reset">螞蟻部落</button> </body> </html>
上面的程式碼實現了我們的要求,更多內容參閱相關閱讀。
相關閱讀:
(1).border-radius可以參閱CSS3 border-radius一章節。
(2).box-shadow可以參閱CSS3 box-shadow一章節。
相關文章
- CSS3簡單圓角立體按鈕效果CSSS3
- 通過xml檔案實現自定義圓角按鈕,以及點選效果XML
- Bootstrap按鈕圓角改成直角boot
- UIImageView 實現圓角效果UIView
- css3實現的矩形圓角切角效果CSSS3
- 分享 用CSS實現無圖片圓角效果CSS
- WPF Button按鈕設定圓角
- 利用css變數實現按鈕懸浮效果CSS變數
- php短視訊原始碼,按鈕的圓角圖示實現PHP原始碼
- CSS3模擬實現iphone返回按鈕效果CSSS3iPhone
- css3實現的圓角效果程式碼例項CSSS3
- css立體按鈕效果CSS
- CSS 叉號按鈕效果CSS
- CSS3圓角表格效果CSSS3
- 直播app系統原始碼,Flutter MaterialButton 實現圓角邊框按鈕APP原始碼Flutter
- css3實現的滑鼠懸浮按鈕動畫效果CSSS3動畫
- css3實現的美觀的提交按鈕效果CSSS3
- CSS3實現的div圓角效果程式碼例項CSSS3
- CSS3動畫按鈕效果CSSS3動畫
- css3實現button按鈕美化效果程式碼例項CSSS3
- css3實現底部帶有箭頭的圓角矩形效果CSSS3
- CSS實現帶箭頭按鈕CSS
- css叉號關閉按鈕效果CSS
- 精選10款CSS3實現的酷炫按鈕效果CSSS3
- 如何實現css漸變圓角邊框CSS
- 點選按鈕實現數字增加效果
- css3實現的滑鼠懸浮立體動態按鈕效果CSSS3
- CSS3 帶有箭頭圓角效果CSSS3
- CustomPainter——微信拍視訊按鈕效果實現AI
- 點選按鈕實現狀態切換效果
- 點選按鈕實現圖片切換效果
- css實現圓形、橢圓和半圓效果程式碼例項CSS
- CSS3 checkbox開關按鈕效果CSSS3
- CSS3滑鼠懸浮動畫按鈕效果CSSS3動畫
- 每日CSS_霓虹燈按鈕懸停效果CSS
- CSS3滑動開關按鈕效果CSSS3
- CSS3叉號按鈕效果詳解CSSS3
- CSS實現三角形效果CSS