42 lines
1.1 KiB
CSS
42 lines
1.1 KiB
CSS
/* You can add global styles to this file, and also import other style files */
|
|
|
|
.hexagon {
|
|
width: 400px;
|
|
height: 200px;
|
|
background: red;
|
|
transform: rotate(120deg);
|
|
-moz-transform: rotate(120deg);
|
|
-ms-transform: rotate(120deg);
|
|
-o-transform: rotate(120deg);
|
|
-webkit-transform: rotate(120deg);
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
}
|
|
.hexagon-inside {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: green;
|
|
transform: rotate(-60deg);
|
|
-moz-transform: rotate(-60deg);
|
|
-ms-transform: rotate(-60deg);
|
|
-o-transform: rotate(-60deg);
|
|
-webkit-transform: rotate(-60deg);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.hexagon-image {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-image: url("http://static.vdk2ch.ru:15555/test-public/2.jpg");
|
|
background-position: center;
|
|
background-size: 60%;
|
|
transform: rotate(-60deg);
|
|
-moz-transform: rotate(-60deg);
|
|
-ms-transform: rotate(-60deg);
|
|
-o-transform: rotate(-60deg);
|
|
-webkit-transform: rotate(-60deg);
|
|
visibility: visible;
|
|
}
|
|
body {
|
|
background-color: #eee;
|
|
} |