用css3 怎么制作菱形图片，图片是正的不旋转，新手求大神指点，最好把代码写出来，

html-css069

用css3 怎么制作菱形图片，图片是正的不旋转，新手求大神指点，最好把代码写出来，,第1张

思路: div旋转45度 img旋转-45度

html:<div class="lx"><img src="img/replace_me.jpg" alt=""></div>

css:

.lx{transform:rotate(45deg)width:400pxheight:400pxoverflow:hiddenvertical-align: middletext-align: centermargin:100px autodisplay:flex}

.lx img{transform:rotate(-45deg)max-width:100%max-height:100%}

可以画两个等腰三角形，等腰三角形代码#ID {

width: 0

height: 0

border-left: 50px solid transparent

border-right: 50px solid transparent

border-bottom: 100px solid red}