在006，我們基於本地最佳默認字體，修改了區塊中的字體。
這次，我們來優化下“傳送門”
加上很有情懷的框框！
突然想起一句名言：
所謂的自由，必須要有限制
哈哈，不扯遠哈～
最近，圓角矩形是網頁開發的必備佳品！
而圓角矩形的精髓就是：
在周邊加上1px的細細白色邊框，然後設置非常小的3px圓角值。
由於超鏈接，默認是紫色的字體，很不和諧，就不設置成004中的粉色了。
用貼近，海浪的Cyan，#33FFFF，004裡面有顏色大全哈 ～
添加代碼如下：
a{
color: #33FFFF;
border:1px solid #33FFFF;
border-radius: 3px
color屬性，設置字體顏色，其實在CSS中，顏色代碼#rrggbb，可以簡寫為#rgb，即#33FFFF，#3FF
border屬性，設置邊框1px，實現，湖藍
border-radius屬性，設置圓角邊框。
看一下效果：
呃……總覺得哪裡不對勁？ ！
邊框！ ！
外框離字體太近了，沒有距離美！
另外，超鏈接自帶的一條線，擺在那裡太傻了！
我們需要給他改成一個可愛性感的按鈕
添加代碼如下：
a{
font-size: 55px;
background: #33FFFF;
color: #FFF;
border:1px solid #33FFFF;
border-radius: 10px;
padding:10px 66px;
text-decoration: none;
padding屬性，上下兩側10px，左右兩側，66px
text-decoration屬性，none就是去掉鏈接下劃線。
由於，之前字體為了打廣告，設計的大了些，所以圓角矩形也放大些 。
最後噔噔噔噔——
魚油們，如果喜歡本系列HTML的帖子，可以到論壇訂閱 ☞ HTML5 - 庖丁解牛 此專輯哦~~
文章為用戶上傳，僅供非商業瀏覽。發布者：Lomu，轉轉請註明出處： https://www.daogebangong.com/zh-Hant/articles/detail/HTML5%20%200%200%207%20%20Optimized%20Portal.html
支付宝扫一扫 
评论列表（196条）
测试