W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html> <head> <style> #container { display: grid; grid-template-columns: fit-content(250px) fit-content(250px) auto; grid-gap: 7px; box-sizing: border-box; height: 150px; width: 100%; background-color: green; padding: 7px; } #container > div { background-color: beige; padding: 5px; } </style> </head> <body> <h1>fit-content() 函数</h1> <div id="container"> <div>一些文本。一些文本。</div> <div>更多文本。因为这个 div 的内容宽度超过了最大宽度，所以被限制在 250 像素。</div> <div>这个 div 设置为 auto。</div> </div> </body> </html>