Heim > Web-Frontend > CSS-Tutorial > Detaillierte Erläuterung der Grenzinstanzen in CSS3

Detaillierte Erläuterung der Grenzinstanzen in CSS3

零下一度
Freigeben: 2017-06-16 13:46:03
Original
1695 Leute haben es durchsucht

So entfernen Sie HTML-IMG-Bildränder mit CSS

Hallo, wenn Sie viele Webseitenbilder haben und die Ränder entfernen möchten, schreiben Sie einfach eine Codezeile hinein CSS.

<style>
img{border:0;}
</style>
Nach dem Login kopieren

Wenn Sie den Rand eines IMG-Bildes einzeln entfernen möchten, können Sie ihn auch separat definieren. Zum Beispiel:

<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;}
Nach dem Login kopieren

Wie man dem Rand mit CSS einen dreidimensionalen Effekt verleiht

1. Dies kann mit Schatten erreicht werden:
Box -shadow: 1px 1px 2px #226
Bitte beachten Sie jedoch, dass der Browser CSS3 unterstützen muss, um wirksam zu sein

2 Dies kann auch durch Festlegen der Rahmenfarbe erreicht werden: border-bottom: solid 1.5px #. 333;
Hinweis: Sie können den unteren Bereich ändern, um die Größe nach unten anzuzeigen. #333 ist die Farbe. Ich habe sie hier auf Schwarz eingestellt. Sie können festlegen, was Sie möchten. Stellen Sie rechts, oben, links und unten ein, um seine Richtung anzuzeigen.

So fügen Sie einer Div-Ebene einen Bildrand hinzu

Mit der Schiebetürtechnologie werden mehrere Divs verschachtelt und jede Div-Ebene erhält ein anderes Hintergrundbild. Natürlich kann aktuelles CSS3 direkt abgerundete Ecken erzeugen.

So entfernen Sie den Rand des Bildes im CSS-Stil

Detaillierte Erläuterung der Grenzinstanzen in CSS3

img randloser CSS-Stil

img{padding:0; border:0;margin:0;display:block;}
Nach dem Login kopieren

Der Rand auf dem Bild ist beispielsweise 1px

.div{background:url(图片地址) 1px 1px ;width:图片width-2;height:图片height-2;}
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Grenzinstanzen in CSS3. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage