6
私はこのようなプロファイル写真を表示しようとしています - /(スラッシュはskewXを使って斜体を表し、ハイフンは水平に整列した背景画像を表します)。スキューしたレイヤー(CSS)の背景イメージを非表示にするにはどうすればよいですか?
問題は、このコードはまた、背景画像をスキューということである。
.photo {
transform: skewX(35deg);
-ms-transform: skewX(35deg); /* IE 9 */
-webkit-transform: skewX(35deg); /* Safari and Chrome */
width: 100px;
height: 92px;
border-right: 1px solid black;
border-left: 1px solid black;
background-image: url('silhouette.png');
background-repeat: no-repeat;
background-position: top left;
}
...
<div class="photo"></div>
私はこのような背景スキュー逆転しようとしました:[
.photo {
transform: skewX(35deg);
-ms-transform: skewX(35deg); /* IE 9 */
-webkit-transform: skewX(35deg); /* Safari and Chrome */
width: 100px;
height: 92px;
border-right: 1px solid black;
border-left: 1px solid black;
}
.photo div {
transform: skewX(-35deg);
-ms-transform: skewX(-35deg); /* IE 9 */
-webkit-transform: skewX(-35deg); /* Safari and Chrome */
width: 100%;
height: 100%;
background-image: url('silhouette.png');
background-repeat: no-repeat;
background-position: top left;
}
...
<div class="photo"><div></div></div>
を...しかし、私は/取得 - ] /(バックグラウンドは斜めにぴったり一致しません)。
私はこの一日中終わっています。お手伝いできますか?私はコーダーのボックを持っている!