Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch
Heim > Web-Frontend > CSS-Tutorial > CSS3 Bild drehen

CSS3 Bild drehen

高洛峰
Freigeben： 2017-02-17 13:08:27
Original
1496 Leute haben es durchsucht

Codeblock

HTML-Seite:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>rotate image</title>
</head>
<body>
	<div class="polaroid rotate_left">
		<img src="pulpitrock.jpg" alt="" width="284" height="213">
		<p class="caption">The pulpit rock inLysefjorden,Norway.</p>
	</div>

	<div class="polaroid rotate_right">
		<img src="cinqueterre.jpg" alt="" width="284" height="213">
		<p class="caption">Monterosso al Mare. One of the five villages in Cinque Terre.</p>
	</div>
</body>
</html>

css样式:
	<style type="text/css" media="screen">
		body{
			margin:30px;
			background-color: #E9E9E9;
		}	

		div.polaroid{
			width: 294px;
			padding: 10px 10px 20px 10px;
			border:1px solid #BFBFBF;
			background-color: #F0F8FF;
			box-shadow: 4px 4px 6px #aaa;
			border-radius: 5px;
		}

		div.rotate_left{
			float: left;
			-ms-transform:rotate(7deg);
			-webkit-transform:rotate(7deg);
			transform:rotate(7deg);
		}

		div.rotate_right{
			float: left;
			-ms-transform:rotate(-10deg);
			-webkit-transform:rotate(-10deg);
			transform:rotate(-10deg);
		}
	</style>
Nach dem Login kopieren

Weitere Artikel zum Drehen von CSS3-Bildern finden Sie auf der chinesischen PHP-Website!

Verwandte Etiketten：
css3
Quelle：php.cn
Vorheriger Artikel：CSS-Cursor-Eigenschaft Nächster Artikel：Medien-Medienabfragen in CSS3
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
Neueste Artikel des Autors
Aktuelle Ausgaben
Die Seite mobilfreundlich gestalten? Ich habe viele Webseiten und einige Websites. Die Sache ist, ich bin ein Anfänger. Ich ver...
Aus 2024-04-01 20:42:38
0
1
259
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage