Фоновая картинка linear-gradient
|
Код:
|
background-image:
linear-gradient(
to bottom,
#fff,
transparent 50px,
transparent calc(100% - 50px),
#fff
), linear-gradient(
to left,
#fff,
transparent 50px,
transparent calc(100% - 50px),
#fff
); |
<html><head><style type="text/css">table {
border-collapse: collapse;
table-layout: fixed;
box-shadow: 0 0 30px 0 rgba(0,0,0,0.3);
background-color: #ff9800;
background-image: url(http://www.spyderonlines.com/images/wallpapers/natural-hd-wallpaper/natural-hd-wallpaper-8.jpg);
background-size: cover;
width: 75%;
height: 75%;
margin: auto;
}
td {
border: 4px solid #fff;
background-image: linear-gradient(to bottom, #fff, transparent 50px, transparent calc(100% - 50px), #fff), linear-gradient(to left, #fff, transparent 50px, transparent calc(100% - 50px), #fff);
}
body {
display: flex;
}</style></head><body>
<table>
<tbody><tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr></tbody></table></body></html>