邊框(border)在CSS設計中是一項非常重要的設置,可以讓元素看起來更加美觀。CSS3為邊框設置提供了更多的靈活性和多樣性,下面介紹一些比較實用的邊框設置。
/* 設置固定邊框 */ border: 1px solid #000; /* 設置不同寬度的邊框 */ border-top: 1px solid #000; border-right: 2px solid #000; border-bottom: 3px solid #000; border-left: 4px solid #000; /* 設置虛線邊框 */ border: 1px dashed #000; /* 設置圓角邊框 */ border-radius: 5px; /* 設置邊框陰影 */ box-shadow: 1px 1px 5px #000; /* 設置透明邊框 */ border: 1px solid transparent; /* 設置漸變邊框 */ border-image: linear-gradient(to right, red, blue); /* 設置媒體查詢的邊框 */ @media screen and (max-width: 768px) { border: none; }
以上是一些常見的邊框設置,根據設計需求可以靈活運用。需要注意的是,不同瀏覽器對邊框的解析可能會有一些不同,建議先進行測試再進行部署。
上一篇12px 以下 css
下一篇bss和css區別