首頁 > web前端 > css教學 > css3中關於邊框實例的詳解

css3中關於邊框實例的詳解

零下一度
發布: 2017-06-16 13:46:03
原創
1692 人瀏覽過

CSS如何去掉html img圖片邊框

你好,如果你的網頁圖片很多,要想都去掉邊框,在css中統一寫一行程式碼就可以了。

<style>
img{border:0;}
</style>
登入後複製

如果想單獨去掉某1個img圖片的邊框,也可以單獨定義。例如

<div class="pic"><img src="图片地址" <a href="www.baidu.com/s?wd=alt&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1Y1uyN9ujNBn1NWm19Wnyc30ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHTvPWRdP104PWm3nHTYPW0Y" target="_blank" class="baidu-highlight">alt</a>=""></div>
<a href="www.baidu.com/s?wd=css&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1Y1uyN9ujNBn1NWm19Wnyc30ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHTvPWRdP104PWm3nHTYPW0Y" target="_blank" class="baidu-highlight">css</a>写:
.pic img{border:0;}
登入後複製

css怎麼讓邊框有立體效果

1. 可以用陰影實作:
box-shadow: 1px 1px 2px #226
但要注意瀏覽器必須支援css3才有效果

2. 也可以透過設定邊緣顏色實現:border-bottom: solid 1.5px #333;
說明:可以改變bottom表示向下,1.5px表示他的大小,#333 是顏色,我這裡設定是黑色,你可以設定你想要的。設定right,top , left , bottom表示他所在的方向。

如何為div層加上圖片邊框

使用的是滑動門技術,就是若干個div嵌套,每層div給與不同的背景圖片。當然現在的css3可以直接做出圓角效果。

css樣式怎麼去除圖片自帶的邊框 

css3中關於邊框實例的詳解

img沒邊框css樣式

img{padding:0; border:0;margin:0;display:block;}
登入後複製

截取是例如圖片上的邊框是1px

.div{background:url(图片地址) 1px 1px ;width:图片width-2;height:图片height-2;}
登入後複製

以上是css3中關於邊框實例的詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板