英文:
how to make banner take up to 75% of the screen using tailwind`
问题
我一直在尝试让我的横幅显示到屏幕高度的大约75％，而不被裁剪。我没有使用h-screen，因为它会占满整个屏幕高度，而h-96太小了。如何获得所需的结果？
英文:
I've been trying to have my banner show till about 75% of the screen height without getting cropped. I didn't use h-screen cause it takes the full height of the screen and h-96 is too small. How do I get the desired result?
<!DOCTYPE html>
<html lang="en" class="dark">
<head>
<link href="/public/output.css" rel="stylesheet" />
<title>Tailwind</title>
</head>
<body>
<nav>
The Navbar
</nav>
<!-- Banner -->
<div class="bg-cover bg-center bg-no-repeat h-48 lg:h-96" style="background-image: url('https://source.unsplash.com/1280x614/?nature');">
</div>
</body>
</html>
</details>
# 答案1
**得分**: 1
你可以使用模板：`h-[value]` 来设置所需的高度（也可以设置宽度）。
**例如：**
h-[75%]
**或者**
h-[100px]
<details>
<summary>英文:</summary>
You can set any required value for height (and for width too) using the
template: `h-[value]`
**For example:**
h-[75%]
**or**
h-[100px]
</details>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论