CSS
html {
-webkit-filter: grayscale(100%) !important;
-moz-filter: grayscale(100%) !important;
-ms-filter: grayscale(100%) !important;
-o-filter: grayscale(100%) !important;
filter: grayscale(100%) !important;
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1) !important;
}
关键在于transform: translate(-50%, -50%);
.centered {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
这两个背景图CSS样式很有用:
background-attachment:fixed, background-size:cover
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_parallax_percent
https://www.w3schools.com/CSSref/css3_pr_background-size.asp
width: calc(100% - 100px);
为了便于观察,我把边框尺寸做成不一样。
<div style="position:relative">
<div style="width:100px;height:100px;border:3px solid #f00"> </div>
热门内容
最新内容
- 1 day 18 hours ago
- 1 day 18 hours ago
- 1 day 18 hours ago
- 1 day 18 hours ago
- 1 week 3 days ago
- 1 week 3 days ago
- 3 weeks 5 days ago
- 1 month 1 week ago
- 1 month 1 week ago
- 2 months 4 weeks ago
最新评论