2017-05-18 22 views
-2

爲什麼當我向CSS(.heading { })中的標題聲明一個字體系列時,文本會在輸出中消失?爲什麼當我添加字體系列時,文本會消失?

前: Before font-family declaration

後: After font-family declaration


另一個類似,但陌生人問題與FONT-FAMILY聲明的是,添加了聲明之後的文字不會堅持以保證金,填充和邊框規格,並且會與浮動的<div>重疊。即使該行被刪除,該問題仍將持續存在,並且只有使用「ctrl + Z」反轉文件時纔會修復該問題。


代碼:

* { 
 
    
 
     -webkit-box-sizing: border-box; 
 
    
 
     -moz-box-sizing: border-box; 
 
       box-sizing: border-box; 
 
    } 
 
    
 
    
 
    .clearfix { 
 
    \t overflow: auto; 
 
    } 
 

 
    @page{ 
 
    
 
    \t size: 7in 9.25in; 
 
    \t margin: 27mm 16mm 27mm 16mm; \t 
 
    
 
    } 
 
    
 
    #margin { 
 
    \t max-width: 90%; 
 
    \t margin: 0 auto; 
 
    } 
 
    
 
    .sectionHeadingIndent { 
 
    
 
    \t background-color: black; 
 
    \t border: black; 
 
    \t float: left; 
 
    \t width: 5%; 
 
    \t height: 100%; 
 
    \t position: absolute; 
 
    } 
 
    
 
    ***Font-family declaration below here*** 
 
    
 
    .heading { 
 
    
 
    \t margin-left: 5%; 
 
    \t padding-left: 1%; 
 
    \t margin-bottom: 0; 
 
    \t padding-bottom: 0; 
 
    \t border-bottom-style: none; 
 
    \t font-family: Courier; 
 
    } 
 
    
 
    .header { 
 
    \t position: relative 
 
    } 
 
    
 
    .header_firstLine { 
 
    \t position: relative; 
 
    \t margin-bottom: 0; 
 
    \t padding-bottom: 0; 
 
    \t border-bottom-style: none; 
 
    } 
 
    
 
    .header_secondLine { 
 
    \t position: relative; 
 
    \t margin-left: 5%; 
 
    \t padding-left: 1%; 
 
    \t margin-top: 0; 
 
    \t padding-top: 0; 
 
    
 
    \t line-height: 1; 
 
    \t border-top-style: none; 
 
    
 
    } 
 
    
 
    #introduction { 
 
    \t height: 20%; 
 
    } 
 
    
 
    .Subhead { 
 
    \t display: inline-block; 
 
    } 
 
    
 
    
 
    #objective_summary{ 
 
    \t width: 30%; 
 
    \t margin: 10% auto; 
 
    }

 
    <!-- Page boundary div --> 
 
    <div> 
 
    
 
    \t <!-- Margins div --> 
 
    \t <div id = "margin" > 
 
    
 
    
 
    \t \t <section id = "introduction"> 
 
    \t \t <!-- Introduction section --> 
 
    
 
    \t \t \t <div class = "header"> 
 
    
 
    \t \t \t \t <div class = "header_firstLine"> 
 
    \t \t \t \t \t <!-- For indent and Name --> 
 
    \t \t \t \t \t <div class = "sectionHeadingIndent"></div> 
 
    
 
    \t \t \t \t \t <h1 class = "heading", style = "arial">H1</h1> 
 
    \t \t \t \t </div> 
 
    
 
    \t \t \t \t <div class = "header_secondLine clearfix"> 
 
    \t \t \t \t \t <!-- For Contact Information --> 
 
    \t \t \t \t \t <div class = "Subhead"> 
 
    \t \t \t \t \t \t Subheading 
 
    \t \t \t \t \t </div> 
 
    
 
    
 
    \t \t \t \t </div> 
 
    
 
    \t \t \t <div id = "objective_summary"> 
 
    \t \t \t \t Text 
 
    \t \t \t </div> 
 
    
 
    \t \t </section> 
 
    
 
    
 
    \t \t <section> 
 
    \t \t <!-- on Section --> 
 
    \t \t \t <div class = "header"> 
 
    \t \t \t \t <div class = "sectionHeadingIndent"></div> 
 
    
 
    \t \t \t \t <h2 class = "heading">H2</h2> 
 
    \t \t \t </div> 
 
    
 
    
 
    \t \t \t <div> 
 
    
 
    \t \t \t \t <div class = "on_ce"> 
 
    \t \t \t \t \t <div class = "on_name"> 
 
    \t \t \t \t \t \t Text 
 
    \t \t \t \t \t </div> 
 
    \t \t \t \t \t <div class = "on_place"> 
 
    \t \t \t \t \t \t Text 
 
    \t \t \t \t \t </div> 
 
    \t \t \t \t </div> 
 
    
 
    \t \t \t </div> 
 
    
 
    \t \t </section> 
 
    
 
    
 
    \t </div> 
 
    </div> 
 

+2

我從代碼中刪除了「***下面的***字體家族聲明***」,並且一切似乎都正常工作。在css中使用註釋時,應該如下所示:/ *這是註釋*/ – trav

+0

謝謝,我不知道。 – kishan

+0

不用擔心@ kishan! – trav

回答

0

直接複製和粘貼,你的代碼刪除註釋後工作正常

但是,您的代碼還包含錯誤。逗號被使用:

<h1 class = "heading", style = "arial">H1</h1> 
--> 
<h1 class = "heading" style = "arial">H1</h1> 
+0

奇怪的直接複製和粘貼不適用於我。你能想到任何可能導致這種差異的原因嗎? (感謝您指出錯誤,我是新手,而且這也是一次不完整的調試嘗試。) – kishan

+0

我現在唯一能想出的就是損壞的字體文件。你有沒有嘗試另一種字體,如Times New Roman或Arial?確保在CSS中刪除您的評論,否則標題將無法使用。 – SimpleStudent

+0

其實這是我遇到的另一個問題,以及導致您指出錯誤的調試嘗試的原因。那時除了Courier之外沒有其他常見的字體在工作。 現在奇怪你的修復和trav的評論上面使我的測試文件工作像預期的,但不是原來的。 – kishan

相關問題