[英]How can I make a <div> contain HTML response that could be anything?
我的應用程序具有一個屏幕,可用於檢查從API調用返回的響應正文。 通過輸入URL並單擊“執行”,HTML的響應主體將出現在DIV中,就像在網頁中一樣。
但是,顯示的數據大於<div>
的數據,因此發生的是它出現在<div>
。 我試圖通過設置來包含它
<div style="height: 40rem; width: 70rem; overflow: auto;"> HTML Page here </div>
和
<div style="height: 40rem; width: 70rem; overflow: scroll;"> HTML Page here </div>
這不包含<div>
的內容
如何使<div>
的內容完全包含並顯示在滾動條中? 請注意,我不是在尋找jQuery解決方案。
請注意,從服務器返回的每個頁面都將以下樣式自動添加到頁面中。 這是將出現在每個ASP.NET錯誤頁面上的標准樣式。
我現在想知道解決方案是覆蓋此處的任何內容,還是應該以某種方式刪除樣式的某些部分:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>IIS 8.0 Detailed Error - 404.0 - Not Found</title>
<style type="text/css">
<!--
body{margin:0;font-size:.7em;font-family:Verdana,Arial,Helvetica,sans-serif;}
code{margin:0;color:#006600;font-size:1.1em;font-weight:bold;}
.config_source code{font-size:.8em;color:#000000;}
pre{margin:0;font-size:1.4em;word-wrap:break-word;}
ul,ol{margin:10px 0 10px 5px;}
ul.first,ol.first{margin-top:5px;}
fieldset{padding:0 15px 10px 15px;word-break:break-all;}
.summary-container fieldset{padding-bottom:5px;margin-top:4px;}
legend.no-expand-all{padding:2px 15px 4px 10px;margin:0 0 0 -12px;}
legend{color:#333333;;margin:4px 0 8px -12px;_margin-top:0px;
font-weight:bold;font-size:1em;}
a:link,a:visited{color:#007EFF;font-weight:bold;}
a:hover{text-decoration:none;}
h1{font-size:2.4em;margin:0;color:#FFF;}
h2{font-size:1.7em;margin:0;color:#CC0000;}
h3{font-size:1.4em;margin:10px 0 0 0;color:#CC0000;}
h4{font-size:1.2em;margin:10px 0 5px 0;
}#header{width:96%;margin:0 0 0 0;padding:6px 2% 6px 2%;font-family:"trebuchet MS",Verdana,sans-serif;
color:#FFF;background-color:#5C87B2;
}#content{margin:0 0 0 2%;position:relative;}
.summary-container,.content-container{background:#FFF;width:96%;margin-top:8px;padding:10px;position:relative;}
.content-container p{margin:0 0 10px 0;
}#details-left{width:35%;float:left;margin-right:2%;
}#details-right{width:63%;float:left;overflow:hidden;
}#server_version{width:96%;_height:1px;min-height:1px;margin:0 0 5px 0;padding:11px 2% 8px 2%;color:#FFFFFF;
background-color:#5A7FA5;border-bottom:1px solid #C1CFDD;border-top:1px solid #4A6C8E;font-weight:normal;
font-size:1em;color:#FFF;text-align:right;
}#server_version p{margin:5px 0;}
table{margin:4px 0 4px 0;width:100%;border:none;}
td,th{vertical-align:top;padding:3px 0;text-align:left;font-weight:normal;border:none;}
th{width:30%;text-align:right;padding-right:2%;font-weight:bold;}
thead th{background-color:#ebebeb;width:25%;
}#details-right th{width:20%;}
table tr.alt td,table tr.alt th{}
.highlight-code{color:#CC0000;font-weight:bold;font-style:italic;}
.clear{clear:both;}
.preferred{padding:0 5px 2px 5px;font-weight:normal;background:#006633;color:#FFF;font-size:.8em;}
-->
</style>
</head>
<body>
<div id="content">
<div class="content-container">
<h3>HTTP Error 404.0 - Not Found</h3>
<h4>The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.</h4>
</div>
<div class="content-container">
<fieldset><h4>Most likely causes:</h4>
<ul> <li>The directory or file specified does not exist on the Web server.</li> <li>The URL contains a typographical error.</li> <li>A custom filter or module, such as URLScan, restricts access to the file.</li> </ul>
</fieldset>
</div>
<div class="content-container">
<fieldset><h4>Things you can try:</h4>
<ul> <li>Create the content on the Web server.</li> <li>Review the browser URL.</li> <li>Check the failed request tracing log and see which module is calling SetStatus. For more information, click <a href="http://go.microsoft.com/fwlink/?LinkID=66439">here</a>. </li> </ul>
</fieldset>
</div>
<div class="content-container">
<fieldset><h4>Detailed Error Information:</h4>
<div id="details-left">
<table border="0" cellpadding="0" cellspacing="0">
<tr class="alt"><th>Module</th><td> IIS Web Core</td></tr>
<tr><th>Notification</th><td> MapRequestHandler</td></tr>
<tr class="alt"><th>Handler</th><td> StaticFile</td></tr>
<tr><th>Error Code</th><td> 0x80070002</td></tr>
</table>
</div>
<div id="details-right">
<table border="0" cellpadding="0" cellspacing="0">
<tr class="alt"><th>Requested URL</th><td> http://127.0.0.1:17315/api/test</td></tr>
<tr><th>Physical Path</th><td> C:\K\WebRole1\api\test</td></tr>
<tr class="alt"><th>Logon Method</th><td> Anonymous</td></tr>
<tr><th>Logon User</th><td> Anonymous</td></tr>
<tr class="alt"><th>Request Tracing Directory</th><td> C:\Users\Richard\AppData\Local\dftmp\Resources\c841e747-89a0-46a2-87fc-450674d1b67b\directory\DiagnosticStore\FailedReqLogFiles\Web\DEPLOYMENT23(430).WEBROLE1_IN_0_WEB</td></tr>
</table>
<div class="clear"></div>
</div>
</fieldset>
</div>
<div class="content-container">
<fieldset><h4>More Information:</h4>
This error means that the file or directory does not exist on the server. Create the file or directory and try the request again.
<p><a href="http://go.microsoft.com/fwlink/?LinkID=62293&IIS70Error=404,0,0x80070002,7601">View more information »</a></p>
</fieldset>
</div>
</div>
</body>
</html>
有點奇怪,代碼似乎正確。
我剛剛創建了一個小測試,但是我使用了PX和EM而不是將溢出設置為auto的REM。
我有點不確定,因為我在工作,所以不能真正玩得太多。 一個小測試將是確保將樣式應用於元素。 更改元素的背景顏色,然后查看它是否發生了變化。
嘗試display: inline;
由於這是默認值,因此如果您具有*{margin: 0; padding: 0; display: block;}
*{margin: 0; padding: 0; display: block;}
*{margin: 0; padding: 0; display: block;}
可能與此有關,但我對此表示懷疑。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.