2013-03-08 164 views
0

當我將CKEditor 4.0與沒有任何樣式或樣式表關聯的HTML頁面合併時,編輯器在展示項目符號和數字時看起來很好。如何用CKEditor 4.0的默認版本覆蓋網站模板的樣式表

但是,當我應用模板的樣式表/ CSS時,集成的CKEditor組件開始不能正確顯示項目符號和數字。我的意思是它顯示網站的樣式表的項目符號,這是完全沒有指定的上下文。對於例如子彈顯示爲每個文本條目右側的小圖片。或者什麼也沒有顯示爲1,2,3等。

我怎樣才能使CKEditor不使用網站的樣式表,而是使用自己的樣式表。代碼片段如下所示:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
<title>FAQ</title> 
<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic' rel='stylesheet' type='text/css'> 
<link rel="stylesheet" href="~/Content/themes/construct/stylesheets/style.css"> 
<link rel="stylesheet" href="~/Content/themes/construct/stylesheets/responsive.css"> 
<script src="~/Content/themes/construct/scripts/jquery.min.js"></script> 
<script src="~/Content/themes/construct/scripts/jquery.simpleFAQ-0.7.min.js"></script> 
<script src="~/Content/themes/construct/scripts/js_func.js"></script> 
<script src="~/ckeditor/ckeditor.js"></script> 

<script> 
    $(function() { 
     $('#faq').simpleFAQ(); 
    }); 
</script> 

</head> 
<body> 
<div class="wraper"> 
<header class="header"> 
</header> 
</div> 

<!-- /top_title --> 
<!-- /faq_list --> 
<div class="faq_list"> 
    <ul class="filter"> 
    <li class="active all"><a href="#all">All</a></li> 
    <li class="business"><a href="#business">Business</a></li> 
    <li class="technical"><a href="#technical">Technical</a></li> 
    <li class="miscellaneous"><a href="#miscellaneous">Miscellaneous</a></li> 
    </ul> 
    <ul id="faq"> 
    @foreach (var entry in Model.MyList) 
    { 
    <li class="all business"> 
     <p class="question"> 
      @entry.Question 
     </p> 
     @foreach (var newEntry in entry.List2) 
     {    
      <div class="answer" id="editable" contenteditable="true"> 
       <h1>@newEntry.Header</h1> 
       <p>@newEntry.Answer</p> 
      </div> 

      } 
    </li> 
     } 
    </ul> 
</div> 
</body> 
</html> 

感謝您的幫助。 阿拉什

回答

0

覆蓋樣式表是最好的方式..

  1. 複製相同的類到一個新的文件,默認的站點後,該文件鏈接。防爆。 默認:

    .class1 {字體:12px的正常宋體;}

覆蓋

.class1 {font: bold 12px Arial;} 

2 ..按照之前的流程和標記屬性一樣重要!恩..

默認:

.class1 {font: normal 12px Arial;padding:10px;} 

覆蓋:

.class1 {font: normal 12px Arial;padding-left:10px !important;}