0
如果向下滾動https://jsfiddle.net/rtvrueg9/，您可以看到底部的一些內容未顯示。有什麼建議麼？div內容從網頁底部剪下
<?php include 'head.php';?>
A
回答
0
這是因爲位置固定在你的身體，我加了overflow-x：hidden;而不是去除水平滾動條。
如果垂直橫條困擾你刪除unnessary溢出-γ。內容 }
body {
\t \t \t \t \t \t width: 100%;
\t \t \t \t \t \t height: 100%;
\t \t \t \t \t \t padding: 0;
\t \t \t \t \t \t border: 0;
\t \t \t \t \t \t margin: 0;
\t \t \t \t \t overflow-x: hidden; /* EDIT */
\t \t \t \t \t }
\t \t \t \t h1 {
\t \t \t \t \t \t font-family: arial;
\t \t \t \t \t \t color: rgb(128, 128, 128);
\t \t \t \t \t \t text-align: center; \t
\t \t \t \t \t \t margin: 0;
\t \t \t \t \t }
\t \t \t \t \t header {
\t \t \t \t \t \t margin: 0;
\t \t \t \t \t \t padding: 0;
\t \t \t \t \t \t width: 100%;
\t \t \t \t \t \t height: 30%;
\t \t \t \t \t \t background: black;
\t \t \t \t \t \t background-image: url(profile_pic.jpg);
\t \t \t \t \t \t background-repeat: no-repeat;
\t \t \t \t \t \t background-position: right;
\t \t \t \t \t \t background-size: 20% 70%;
\t \t \t \t \t \t color: rgb(190, 190, 190);
\t \t \t \t \t \t text-align: center;
\t \t \t \t \t \t border-spacing: 5px 10px;
\t \t \t \t \t \t border: 1px solid black;
\t \t \t \t \t }
\t \t \t \t \t nav {
\t \t \t \t \t \t display: flex;
\t \t \t \t \t \t text-align: center;
\t \t \t \t \t \t height: 25px;
\t \t \t \t \t \t width: 100%;
\t \t \t \t \t \t background: rgb(80, 80, 80);
\t \t \t \t \t \t border: 1px solid rgb(80, 80, 80);
\t \t \t \t \t }
\t \t \t \t \t .nav_link {
\t \t \t \t \t \t flex-grow: 1;
\t \t \t \t \t \t line-height: 25px;
\t \t \t \t \t }
\t \t \t \t \t a {
\t \t \t \t \t \t text-decoration: none;
\t \t \t \t \t \t color: white;
\t \t \t \t \t }
\t \t \t \t \t a:hover {
\t \t \t \t \t \t text-decoration: underline;
\t \t \t \t \t }
\t \t \t \t \t .content {
\t \t \t \t \t \t width: 100%;
\t \t \t \t \t \t height: 100%;
\t \t \t \t \t \t margin: 0;
\t \t \t \t \t \t overflow-y:scroll; }
\t \t \t \t \t .myPanel {
\t \t \t \t \t \t border: 1px solid black;
\t \t \t \t \t \t border-radius: 7px 7px 7px 7px;
\t \t \t \t \t \t box-shadow: 0px 0px 4px 999;
\t \t \t \t \t \t width: 60%;
\t \t \t \t \t \t margin: 1% auto;
\t \t \t \t \t }
\t \t \t \t \t .myPanel .heading {
\t \t \t \t \t \t background: rgb(80, 80, 80);
\t \t \t \t \t \t border-radius: 5px 5px 0px 0px;
\t \t \t \t \t \t color: white;
\t \t \t \t \t \t padding: 5px 20px;
\t \t \t \t \t }
\t \t \t \t \t .myPanel .panelTime {
\t \t \t \t \t \t padding: 3px 20px;
\t \t \t \t \t \t background: silver;
\t \t \t \t \t \t border-radius: 0px 0px 5px 5px;
\t \t \t \t \t }
\t \t \t \t \t .myPanel p {
\t \t \t \t \t \t margin: 3px 0px 0px 3px;
\t \t \t \t \t }
\t \t \t \t \t .myPanel:hover {
\t \t \t \t \t \t box-shadow: 0px 0px 8px black;
\t \t \t \t \t }
\t \t \t \t \t .myPanel.heading:hover {
\t \t \t \t \t \t background: white;
\t \t \t \t \t \t border-radius: 5px 5px 0px 0px;
\t \t \t \t \t \t color: black;
\t \t \t \t \t \t font-family: arial;
\t \t \t \t \t }
\t \t \t \t \t .myPanel.panelTime:hover {
\t \t \t \t \t \t background: rgb(80, 80, 80);
\t \t \t \t \t \t font-family: arial;
\t \t \t \t \t \t color: white;
\t \t \t \t \t }<?php include 'head.php';?>
<body>
\t <header>
\t \t <h1>Resume</h1>
\t </header>
\t <nav>
\t \t <div class="nav_link">
\t \t \t <a href="index.php"> Home </a>
\t \t </div>
\t \t <div class="nav_link">
\t \t \t <a href="resume.php"> Resume </a>
\t \t </div>
\t \t <div class="nav_link">
\t \t \t <a href="sideprojects.php"> Side Projects </a>
\t \t </div>
\t \t <div class="nav_link">
\t \t \t <a href="aboutme.php"> About Me </a>
\t \t </div>
\t </nav>
\t <div class="content">
\t \t <div class="myPanel">
\t \t \t <div class="heading">US ARMY NATIONAL GUARD</div>
\t \t \t \t <div class="panelTime">
\t \t \t \t <p>03/2014 -- Current</p>
\t \t \t \t \t <div class="panelBody">
\t \t \t \t \t \t \t <p>Crystal River, FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Rank: PV2</ui></br>
\t \t \t \t \t \t \t \t <ui>Diesel Mechanic -- 91H</ui></br>
\t \t \t \t \t \t \t \t <ui>Military Police -- 31b<ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">LILLYS ON THE LAKE</div>
\t \t \t \t <div class="panelTime">
\t \t \t \t \t <p>06/2016 -- 02/2017</p>
\t \t \t \t \t <div class="panelBody">
\t \t \t \t \t \t \t <p>Clermont FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Serving</ui></br>
\t \t \t \t \t \t \t \t <ui>Bartending</ui></br>
\t \t \t \t \t \t \t \t <ui>Service bar</ui></br>
\t \t \t \t \t \t \t \t <ui>Card Holder voids/comps</ui></br>
\t \t \t \t \t \t \t \t <ui>Open/close</ui></br>
\t \t \t \t \t \t \t \t <ui>Food running</ui></br>
\t \t \t \t \t \t \t \t <ui>Expediting</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">PANE D'OR</div>
\t \t \t \t <div class="panelTime">
\t \t \t \t \t <p>08/2015 -- 06/2016</p>
\t \t \t \t \t <div class="panelBody">
\t \t \t \t \t \t \t <p>Winter Garden FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Baking</ui></br>
\t \t \t \t \t \t \t \t <ui>Pastry</ui></br>
\t \t \t \t \t \t \t \t <ui>Delivering</ui></br>
\t \t \t \t \t \t \t \t <ui>Sales at markets/shop</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">Disney</div>
\t \t \t \t <div class="panelTime">
\t \t \t \t \t <p>06/2015 -- 11/2016</p>
\t \t \t \t \t <div class="panelBody">
\t \t \t \t \t \t \t <p>Orlando FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Monorail pilot</ui></br>
\t \t \t \t \t \t \t \t <ui>Platform operator</ui></br>
\t \t \t \t \t \t \t \t <ui>Audience control</ui></br>
\t \t \t \t \t \t \t \t <ui>Customer relations</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">PERFORMANCE YEARS GTO</div>
\t \t \t \t <div class="panelTime">
\t \t \t \t \t <p>01/2012 -- 02/2015</p>
\t \t \t \t \t <div class="panelBody">
\t \t \t \t \t \t
\t \t \t \t \t \t \t <p>Hatfield PA</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Shipping</ui></br>
\t \t \t \t \t \t \t \t <ui>Receiving</ui></br>
\t \t \t \t \t \t \t \t <ui>Pulling/packing/sorting</ui></br>
\t \t \t \t \t \t \t \t <ui>Picker operator</ui></br>
\t \t \t \t \t \t \t \t <ui>Forklift operator</ui></br>
\t \t \t \t \t \t \t \t <ui>Customer service</ui></br>
\t \t \t \t \t \t \t \t <ui>In house sales</ui></br>
\t \t \t \t \t \t \t \t <ui>Show sales</ui></br>
\t \t \t \t \t \t \t \t <ui>Inventory</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t
\t \t \t \t \t
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">GIANT FOODS</div>
\t \t \t \t <div class="panelTime">
\t \t \t \t \t <p>01/2012 -- 03/2013</p>
\t \t \t \t \t <div class="panelBody">
\t \t \t \t \t \t \t <p>Montgomeryville PA</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Stocking shelves</ui></br>
\t \t \t \t \t \t \t \t <ui>Rotate merchandise</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </div>+1
好吧所以這修復了滾動條到達底部，但它現在打破我的頭，我的IMG現在是小 –
+1
編輯：好吧，所以我改變了我的標題從30％的高度到25vh，它是工作方式更好 –
0
用途：
<?php include_once("head.php"); ?>
一定的head.php文件是在HTML文件的同一目錄下，你也HTLM文件應該從index.html的用的index.php改名php擴展
相關問題
- 1. Webview內容從底部裁剪[ANDROID]
- 2. rightsidebar從內容div的底部開始
- 3. HTML頁腳底部下所有內容
- 4. Div的內部Div從底部開始
- 5. 底部div div內
- 6. 對齊div下面的一些內容和位置頁腳底部div
- 7. 滾動到div中內容的底部
- 8. 將div的內容與底部對齊
- 9. 水平滑動內容的底部div
- 10. 多個div內底部div
- 11. jquery滾動div推動頁面底部的內容
- 12. 定位頁面的div底部並保持以上內容
- 13. 將DIV標籤擴展到頁面或內容的底部
- 14. 將CSS內容div擴展到頁面底部
- 15. 獲取內容div以觸及頁面底部
- 16. jQuery標籤內容增加重疊內容到底部div
- 17. 底部有可變內容的頁腳
- 18. Java：從Google下載網頁內容https
- 19. 剪輯div的內容
- 20. 從頁面底部的div中滑動？
- 21. 調整容器div內div的邊緣頂部將內部div和容器div從主體推下
- 22. div位於頁面底部
- 23. css anchor div頁的底部
- 24. 將Div Div粘貼到屏幕底部直到內容變長
- 25. 在內容div的底部放置一個div
- 26. div的底部透明（包含div的內容）
- 27. 把一個div放在容器中的內容的底部
- 28. 如何將div從頁面頂部延伸到頁面底部？
- 29. SharePoint：jQuery切換刪除所有SharePoint頂部div，留下網頁底部的空間？
- 30. CSS：卡箍div的頂部和底部內嵌容器
請在此處添加有意義的代碼和問題說明。請不要鏈接到需要修復的網站 - 否則，一旦 問題得到解決，或者您鏈接到的網站無法訪問，此問題將對未來的訪問者失去任何價值。發佈 [最小，完整和可驗證示例（MCVE）]（http://stackoverflow.com/help/mcve） 顯示您的問題將幫助您獲得更好的答案。欲瞭解更多信息，請參閱 [我網站上的某些內容不起作用。我可以直接粘貼一個鏈接嗎？]（https://meta.stackexchange.com/questions/125997/） 謝謝！ –