css - Making shaped viewport for pictures -


i'm trying make "skewed" shape viewport window pictures

pic1 want make (i don't know how pictures have)

enter image description here

pic2 picture use base (background)

enter image description here

i'm using viewport window in css

.town_window{ width:190px; height:165px; -webkit-transform: skew(20deg);  -moz-transform: skew(20deg);  -o-transform: skew(20deg); color: grey; opacity: 0.7; overflow: hidden; } #caluga{ background:url(images/caluga.jpg) no-repeat; width: 277px; height: 190px; } 

i'm getting scewed picture (i understand why), cannot figure out how accomplish task.

please ))

thanks in advance, alexei


Comments

Popular posts from this blog

html - Sizing a high-res image (~8MB) to display entirely in a small div (circular, diameter 100px) -

java - IntelliJ - No such instance method -

identifier - Is it possible for an html5 document to have two ids? -