文本不出現標題

我試着解決問題，但無濟於事。這可能是尺寸不允許我看到我希望顯示在標題下方的文字嗎？這是我的代碼。我非常感謝任何見解。該段落不出現在標題的底部。再次，任何幫助將不勝感激。文本不出現標題

<script> 
    $(document).ready(function()){ 
    }); 
</script> 

<style> 
    .body{ 
    margin: 0px;  
    } 
    .homeButton{ 
    width: 40px; 
    } 
    #MidPort{ 
    background-image: url(""); 
    height:750px; 
    width:1050px; 
    background-size:cover; 
    } 
    .topnav{ 
    font-size: 20px; 
    font-family: Times New Roman; 
    position:fixed; 
    top 0; 
    width:100%; 
    } 
    #bg2{ 
    background-color:red; 
    } 
    ul{ 
    list-style-type:none; 
    margin:0; 
    padding:0; 
    overflow: hidden; 
    background-color: #333 
    } 
    li{ 
    float:left; 
    border-right:1px solid #bbb; 
    }  
    li a { 
    display: block; 
    color: white; 
    text-align: center; 
    padding: 14px 16px; 
    text-decoration: none; 
    } 
    li a:hover { 
    background-color: red; 
    }  
    .active{ 
    background-color:#4CAF50; 
    } 
    li a:hover:not(.active) 
    { 
    background-color: #111; 
    } 
    li:last-child{ 
    border-right:none; 
    } 
</style> 

<!-- Check to see if the navigation bar remains at the bottom if I use the nav class instead of ul. If not, revert back to ul for when the user scrolls down--> 

<div> 
    <header> 
    <!--<div class="container">--> 
    <h2 class="topnav" id="cs2"> 
     <ul> 
     <li><a class="active" href="/home">Home</li></a> 
     <li><a href="/About me">About Me</li></a> 
     <li><a href="Contact">Contact</li></a> 
     </ul> 
    </h2> 
    </header> 
</div> 
<main> 
    <header> 
    <div class="intro-text"> 
     <p>Front-End Developer and Economist, with experience in project management, machine learning, and leadership roles; devoted to functional programming and analyzing mathematical models to solve ongoing economic</p> 
    </div> 
    </header> 
</main> 
<!--setup a home button at the bottom-->

來源

2017-07-25 Brian Aquino

首先，這是可怕的HTML！你永遠不應該有這樣的標籤：

<a><b></a></b>

你必須NEST標籤！即

<a><b></b></a>

修復這個問題，看看你在哪裏。

來源

2017-07-25 20:57:39 cbrauns

你有一些在你的代碼混淆了標籤的，我試圖清除它

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
<script> 
 
</script> 
 

 
<style> 
 
    .body{ 
 
    margin: 0px; 
 
    } 
 

 
    .homeButton{ 
 
    width: 40px; 
 
    } 
 

 
    #MidPort{ 
 
    background-image: url(""); 
 
    height:750px; 
 
    width:1050px; 
 
    background-size:cover; 
 
    } 
 

 
    .topnav{ 
 
    font-size: 20px; 
 
    font-family: Times New Roman; 
 
    position:fixed; 
 
    top 0; 
 
    width:100%; 
 
    } 
 

 
    #bg2{ 
 
    background-color:red; 
 
    } 
 

 
    ul{ 
 
    list-style-type:none; 
 
    margin:0; 
 
    padding:0; 
 
    overflow: hidden; 
 
    background-color: #333 
 
} 
 

 
    li{ 
 
    float:left; 
 
    border-right:1px solid #bbb; 
 
    }  
 

 
    li a { 
 
    display: block; 
 
    color: white; 
 
    text-align: center; 
 
    padding: 14px 16px; 
 
    text-decoration: none; 
 
} 
 

 
li a:hover { 
 
    background-color: red; 
 
} 
 

 
    .active{ 
 
    background-color:#4CAF50; 
 
    } 
 
    li a:hover:not(.active) 
 
    { 
 
    background-color: #111; 
 
    } 
 
    li:last-child{ 
 
    border-right:none; 
 
    } 
 
</style> 
 
</head> 
 

 
<!-- Check to see if the navigation bar remains at the bottom if I use the nav class instead of ul. If not, revert back to ul for when the user scrolls down--> 
 
<body> 
 

 

 
<div> 
 
<header> 
 
    <div class="topnav" id="cs2"> 
 
     <ul> 
 
     <li><a href="/home" class="active" >Home</a></li> 
 
     <li><a href="/About me" >About Me</a></li> 
 
     <li><a href="Contact" >Contact</a></li> 
 
     </ul> 
 
    </div> 
 
</header> 
 
    </div> 
 
    <main> 
 
    <header> 
 
    <div class="intro-text"> 
 

 

 
    <p>Front-End Developer and Economist, with experience in project management, machine learning, and leadership roles; devoted to functional programming and analyzing mathematical models to solve ongoing economic</p> 
 

 
    </div> 
 
     </header> 
 

 
    </main> 
 
    <!--setup a home button at the bottom--> 
 
    </body> 
 
</html>

來源

2017-07-25 20:58:45 stephan14x

的一段是頭以上，因爲.topnav有position:fixed。將其設置爲position:relative將解決您的問題。

這裏是你的代碼的清理版本的jsfiddle： https://jsfiddle.net/fv73pwym/1/

來源

2017-07-25 21:02:34 Eric

文本不出現標題

回答

相關問題