Home
HTML
HTML
Tryit: HTML
运行 ❯
×
Change Orientation
Change Theme, Dark/Light
<!DOCTYPE html> <html> <head> <style> #example1 { border: 2px solid black; padding: 25px; background: url("w3css.gif"); background-repeat: repeat; } #example2 { border: 2px solid black; padding: 25px; background: url("w3css.gif"); background-repeat: space; } #example3 { border: 1px solid black; padding: 25px; background: url("w3css.gif"); background-repeat: round; } </style> </head> <body> <h2>background-repeat: repeat (default)</h2> <p>在这里，背景图像在垂直和水平方向上重复出现。 如果不适合，将裁剪最后一张图像。 这是默认值：</p> <div id="example1"> <h3>Hello World!</h3> </div> <h2>background-repeat: space</h2> <p>在这里，背景图像尽可能多地重复而不剪裁。 第一个和最后一个图像固定在元素的任一侧，空白在图像之间均匀分布。</p> <div id="example2"> <h3>Hello World!</h3> </div> <h2>background-repeat: round</h2> <p>在这里，背景图像被重复并挤压或拉伸，以填充空间（无间隙）：</p> <div id="example3"> <h3>Hello World!</h3> </div> </body> </html>