12月 2017 ~ 米煎的學習筆記 Mi-Jian's Note

2017年12月31日星期日

http://www.zhangxinxu.com/wordpress/2015/03/css3-object-position-object-fit/

.box { width: 160px; height: 160px; margin: 10px 0 20px; background-color: #beceeb; overflow: hidden; resize: both; }
.box > img {width: 100%; height: 100%; background-color: #cd0000;}
.fill { object-fit: fill; }
.contain { object-fit: contain; }
.cover { object-fit: cover; }
.none { object-fit: none; }
.scale-down { object-fit: scale-down; }

梯形

Penny 晚上7:49 沒有留言

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div class="trapezoid">
</div>
</body>
</html>

.trapezoid{
background-image: url(../image/bg.jpg);
color: white;
width: 0;
border-left: 1600px solid transparent;
border-bottom: 50px solid white;
}