當前位置：首頁 > 前端技术 > HTML >内容正文

HTML

web前端教程：css实现容器高度适应屏幕高度

發布時間：2025/3/15 HTML 26 豆豆

生活随笔收集整理的這篇文章主要介紹了 web前端教程：css实现容器高度适应屏幕高度小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

<!DOCTYPE html>

<html>

<head>

<title>訂閱號：webjiaocheng</title>

<style>

padding:0;

margin:0;

}

body,html{

height:100%;

}

#box{

width:500px;

margin:0 auto;

outline:1px solid #F00;

height:100%;

}

</style>

</head>

<body>

</body>

</html>

要點1：設置box的高度height:100%;要點2：設置body，html的高度height:100%;

ps : 星號選擇符僅用戶測試案例，不推薦使用在正式項目中。

前端愛好者們約定，閱讀后：

if（‘覺得有用’）｛

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

以上是生活随笔為你收集整理的web前端教程：css实现容器高度适应屏幕高度的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。