左右两边高度自适应，右边宽度为浏览器宽度-200px。这个是怎么理解的呀？_html/css_WEB-ITnose
按照图片那样的排版，但是，但是，错了。求正确写法？先谢谢各位啦~~~
不理解右边的那个宽度是怎么写的？还有不知道错了，是不是右边的宽度计算错误了？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>初试试题</title><style>body { margin:0px 0px; padding:0px 0px; color:#fff; text-align:center;}#header { background:#0175ed; height:120px; line-height:120px;}#header, #footer, #container { margin: 0px auto; width: 100%;}#contentWrap { margin-left: -200px; float:right; width: 100%; background:#86aef7}#content { margin-left: 200px;}#side { float:left; width: 200px; background:#55a3f3;}#contentWrap,#side{ min-height: 500px; height: auto !important; height: 500px;}#footer { clear: both; background:#0175ed; height:50px; line-height:50px;}</style></head><body><div id="container"><div id="header">高度120px</div><div id="main"><div id="contentWrap"><div id="content">右边宽度100%-200px</div></div><div id="side">左边宽度200px</div></div><div id="footer">底部高度50px</div></div></body></html>
回复讨论(解决方案)
--》
width：100%
position: abusote;
left ： 0px;
用padding-left:200px; 来占位吧
--》
所以，你这个回复是什么意思呢？
高度 自适应 老的浏览器可能不行 所以要 写js计算把
高度 自适应 老的浏览器可能不行 所以要 写js计算把 右边=浏览器宽度-200px，这个怎么理解的呀？
这样做可以实现以上所说布局
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>初试试题</title><style>body { margin:0px 0px; padding:0px 0px; color:#fff; text-align:center;}#header { background:#0175ed; height:120px; line-height:120px;}#header, #footer, #container { margin: 0px auto; width: 100%;}#right,#side{ min-height: 500px; height: auto !important; height: 500px;}#side { float:left; width: 200px; background:#55a3f3;}#right { background:#86aef7}#footer { clear: both; background:#0175ed; height:50px; line-height:50px;}</style></head><body><div id="container"> <div id="header">高度120px</div> <div id="main"> <div id="side">左边宽度200px</div> <div id="right">右边宽度100%-200px</div> </div> <div id="footer">底部高度50px</div></div></body></html>
这样做可以实现以上所说布局
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>初试试题</title><style>body { margin:0px 0px; padding:0px 0px; color:#fff; text-align:center;}#header { background:#0175ed; height:120px; line-height:120px;}#header, #footer, #container { margin: 0px auto; width: 100%;}#right,#side{ min-height: 500px; height: auto !important; height: 500px;}#side { float:left; width: 200px; background:#55a3f3;}#right { background:#86aef7}#footer { clear: both; background:#0175ed; height:50px; line-height:50px;}</style></head><body><div id="container"> <div id="header">高度120px</div> <div id="main"> <div id="side">左边宽度200px</div> <div id="right">右边宽度100%-200px</div> </div> <div id="footer">底部高度50px</div></div></body></html> 是可以实现，但是，我想知道右边的宽度计算。你这个写法不对吧~~~
熱AI工具
Undress AI Tool
免費脫衣圖片
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
上網404怎麼解決
Aug 12, 2025 pm 09:21 PM
如何解決上網 404 錯誤：檢查 URL 是否正確。刷新頁面。清除瀏覽器緩存：Chrome：右上角三個點 > 更多工具 > 清除瀏覽數據 > 勾選 "緩存的圖片和文件" > 清除數據Firefox：右上角三個橫線 > 選項 > 隱私與安全 > 清除歷史記錄 > 勾選 "緩存" > 確定Safari：菜
wlfi合約地址是什麼？ wlfi幣總量多少？
Aug 21, 2025 am 08:51 AM
WLFI是Web3項目WiFi Map的原生功能型代幣，旨在通過去中心化的方式構建一個全球性的無線網絡連接社區。本文將為您詳細介紹WLFI代幣的核心信息，包括其官方合約地址、代幣總量以及相關的查詢方式，幫助您準確了解該項目的基礎數據。
歐易交易所怎麼樣註冊的?歐易交易所註冊流程2025
Aug 22, 2025 pm 07:33 PM
歐易（OKX）是一款全球知名的數字資產交易平台，為廣大用戶提供安全、穩定、可靠的數字資產交易服務，支持多種主流及新興的數字資產。首先通過官方鏈接下載歐易App，點擊下載按鈕獲取安裝包，安裝時允許必要權限並繼續安裝，完成後打開應用註冊賬號，使用手機號或郵箱設置密碼並完成驗證，最後進行身份認證以保障賬戶安全。
幣圈一萬本金如何滾成百萬？這五個步驟缺一不可！
Aug 12, 2025 pm 07:03 PM
在數字貨幣的浪潮中，將一萬本金變為百萬，聽起來像是天方夜譚，但對於掌握了正確方法論的參與者而言，這並非一個完全不可能實現的路徑。這個過程充滿了風險與挑戰，它需要的不是一夜暴富的幻想，而是一套嚴謹、系統化的操作策略。這趟旅程的每一步都環環相扣，構成了從量變到質變的核心驅動力。以下五個步驟，描繪了這樣一條充滿荊棘卻又可能通往成功的道路。
什麼是柚子幣（EOS）？ EOS市場分析及價格預測2025-2030年
Aug 14, 2025 pm 12:03 PM
目錄什麼是EOS?項目背景項目類別1.智能合約Layer-1基礎設施2.委託權益證明(DPoS)生態系統3.Web3dApp和開發者生態系統戰略展望市場分析價格分析價格預測：EOS2025-20302025年預測2026年預測2027年預測2028-2030年預測價格預測表項目概述常見問題結論自其雄心勃勃的推出以來， EOS.IO 被公認為技術最先進的區塊鏈平台之一，旨在解決像以太坊這樣的傳統網絡所面臨的可擴
幣安智能鏈上新 Tokens 項目潛力大揭秘
Aug 16, 2025 pm 12:42 PM
幣安智能鏈憑藉EVM兼容、低手續費和強大生態支持迅速崛起，成為新Tokens項目熱土。識別潛力項目需從團隊背景、創新性、技術架構、社區活躍度、經濟模型和生態整合六大維度綜合評估。同時需警惕市場競爭、技術漏洞、團隊執行力不足及“Rug Pull”等風險。通過系統性研究流程——信息收集、技術與經濟模型分析、團隊與社區評估、風險判斷——可提升投資決策質量。頂級交易所如幣安、OKX、火幣通過嚴格審核上線優質項目，為投資者提供重要參考。
電腦的系統托盤圖標雜亂，如何整理？
Aug 21, 2025 pm 08:12 PM
隱藏系統托盤圖標不影響程序運行，僅移除視覺顯示；2.徹底清理需通過任務管理器禁用非必要啟動項；3.根治雜亂須卸載不用軟件並養成安裝時取消捆綁勾選的習慣，這樣才能實現視覺清爽與資源優化的雙重目標。
Token是什麼
Aug 16, 2025 pm 12:39 PM
Token是區塊鏈上的數字資產，代表權益或價值，可分為支付、實用、證券、穩定幣和NFT等類型，用於價值儲存、交換、治理、獎勵、訪問和抵押，通過智能合約在以太坊等鏈上發行，依賴ERC-20等標準創建，可在中心化或去中心化交易所交易，存儲於熱存儲（如MetaMask）或冷存儲（如Ledger），但面臨價格波動、監管、技術、項目、流動性和安全等風險，需謹慎對待。
