现在已经不存在很多兼容性问题了吗？用firefox打开只有-webkit-的依旧可以正常显示。

来源：3-25 编程练习

ArtoriasWong

2019-09-04 18:15:31

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8" />
<title>渐变应用</title>
<style type="text/css">
div {
width: 400px;
height: 400px;
background-color: yellow;
/* background-size: 100px 100px; */
background-image: -webkit-linear-gradient(
45deg,
purple 25%,
transparent 25%
),
-webkit-linear-gradient(-45deg, purple 25%, transparent 25%),
-webkit-linear-gradient(135deg, purple 25%, transparent 25%),
-webkit-linear-gradient(-135deg, purple 25%, transparent 25%);

background-image: -moz-linear-gradient(
45deg,
purple 25%,
transparent 25%
),
-moz-linear-gradient(-45deg, purple 25%, transparent 25%),
-moz-linear-gradient(135deg, purple 25%, transparent 25%),
-moz-linear-gradient(-135deg, purple 25%, transparent 25%);

background-image:-o-linear-gradient(
45deg,
purple 25%,
transparent 25%
),
-o-linear-gradient(-45deg, purple 25%, transparent 25%),
-o-linear-gradient(135deg, purple 25%, transparent 25%),
-o-linear-gradient(-135deg, purple 25%, transparent 25%);

background-image: linear-gradient(
45deg,
purple 25%,
transparent 25%
),
linear-gradient(-45deg, purple 25%, transparent 25%),
linear-gradient(135deg, purple 25%, transparent 25%),
linear-gradient(-135deg, purple 25%, transparent 25%);
}
</style>
</head>
<body>
<div></div>
</body>
</html>

写回答

1回答