CSS 邊框實現圓角矩形
阿新 • • 發佈：2019-02-15
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>div+CSS圓角矩形</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/CSS"> .roundedRectangle{ height: 70px; width: 100px; margin-top: 100px; background: #9BD1FA;//背景色 border-width: 10px; //邊緣的寬度，如果要分別設定可以這樣：border-width: 15px 5px 15px 5px;依次為上、右、下、左 border-style: solid; border-radius: 15px; //圓角的大小 border-color: #000 #000 #000 #000; //邊框顏色，依次為上、右、下、左 } .roundedRectangle p{ margin: 0px auto; padding: 20px; text-align:center; font-size: 20px; letter-spacing:8px; } </style> </head> <body> <div class="roundedRectangle"> <p>測試</p> </div> </body> </html>
—————————————————————————————————
本文原創自
本部落格所有原創文章請以連結形式註明出處。
歡迎關注本技術部落格，本部落格的文章會不定期更新。
大多數人想要改造這個世界，但卻罕有人想改造自己。
世上沒有絕望的處境，只有對處境絕望的人。
————By slience
—————————————————————————————————