问题
I have the following HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<title>test</title>
</head>
<body>
<div style="height:100%;background: url('https://apprecs.org/ios/images/app-icons/256/90/1097333136.jpg') 100% 0 no-repeat / 4%;">
<p>
bob
Is
The
best!
</p>
</div>
</body>
</html>
The image displays well but when I go to the HTML validator I get an error:
Error: CSS: background: / is an incorrect operator.
If I remove that / then the image doesn't appear. What is the correct way?
回答1:
If we refer to the formal syntax:
The / is the separation between background-position and background-size (this one being optional) so the correct syntax is:
background: url(...) 100% 0/4% no-repeat;
Where background-position:100% 0 and background-size:4%
Note that background-size should always be specified with background-position when using shorthand syntax. You cannot specify the size without position but you can specify position without size:
background: url(...) 100% 0 no-repeat;
Relatad question: Issues with "background-position" in "background" shorthand property
来源：https://stackoverflow.com/questions/54055445/error-css-background-is-an-incorrect-operator