lunarsf-Lunar-Markdown-Editor
/
LunarMarkdownEditor
/
JsAndCss
/
测试CSS定义的示例.html

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><title>测试CSS定义的示例</title><meta name="info" content="测试CSS定义的示例.md" ><meta name="viewport" content="width=device-width, user-scalable=yes" /><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><link id='themeLink' rel="stylesheet" href="lesson_light.css" type="text/css"><script>function ShowPage() {document.getElementById('content').style.visibility = "visible";}function HidePage(){document.getElementById('content').style.visibility = "hidden";}</script></head><body><div style="text-align:right"><span class="pageheader">页眉文本</span><a onclick="print()" style="visibility: hidden">打印〔此功能会丢失内容〕...</a></div><div id="printArea"><p class='fileheader'>测试CSS定义的示例</p><hr /><div id="content"><script src="jquery-1.7.0.min.js"></script><script src="jquery.jqprint-0.3.js"></script><script language="javascript">function print() {$("#printArea").jqprint({importCSS: true});}</script><script>$(document).ready(function(){$("#title2").click(function(){$("#panel2").toggle();});});$(document).ready(function(){$("#title3").click(function(){$("#panel3").toggle();});});$(document).ready(function(){$("#title4").click(function(){$("#panel4").toggle();});});</script><p>Lunar Markdown 在标准 Markdown 语法的基础上自定义了一些语法元素，以满足特定的需要。</p>

<h1 id="title2">文档可以设置一个总标题</h1><div id="panel2">

<h2>二级标题</h2>

<h3>三级标题</h3>

<h4>四级标题</h4>

<h5>五级标题</h5>

<h6>六级标题</h6>

<p><hr class="hr1" style='height:24px'/>
<hr class="hr2"/>
<hr class="hr3"/></p>

<hr class="hr4"/>

<hr class="hr5"/>

</div><h1 id="title3">region 这是首</h1><div id="panel3">

<p>===这是个分割线===</p>

<div style='border-left:1px dashed blue;border-right:1px dashed blue;'>
<p style='text-align:center;border-top:4px solid blue;border-bottom:1px dotted blue;text-indent:0px;'>这是个起分割线</p>


<table><caption>标题</caption><tr><th style="TEXT-ALIGN: center;">表头</th><th style="TEXT-ALIGN: center;">表头2</th></tr><tr><td style="TEXT-ALIGN: left;">单元格1</td><td style="TEXT-ALIGN: left;">单元格2</td></tr></table>
<p style='text-align:center;border-top:1px dotted blue;border-bottom:4px solid blue;text-indent:0px;'>这是个终分割线</p>
</div>

</div><h1 id="title4">end region 这是尾</h1><div id="panel4">

<table><caption>标题</caption><tr><th style="TEXT-ALIGN: center;">表头</th><th style="TEXT-ALIGN: center;">表头2</th></tr><tr><td style="TEXT-ALIGN: left;">单元格1</td><td style="TEXT-ALIGN: left;">单元格2</td></tr></table>

<p>普通段落文本。</p>

<pre><code>代码块
代码块行2
</code></pre>

<p>普通文本段落中<code>内嵌</code>的Code.</p>

<p>%文档总标题</p>

<p><a href="http://www.baidu.com">百度官网</a></p>

<blockquote>
  <p>块引用行1
  块引用行2 </p>
</blockquote>

<p>普通段落文本。</p>

<blockquote>
  <blockquote>
    <p>嵌套的块引用
    嵌套的块引用</p>

    <blockquote>
      <p>三层嵌套的块引用文本</p>
    </blockquote>
  </blockquote>
</blockquote>

<ul>
<li>无序列表项1</li>
<li>无序列表项2</li>
</ul>

<p>普通段落文本</p>

<ol>
<li>有序列表项1</li>
<li>有序列表项2</li>
</ol>

<p>普通段落文本</p>

<ul>
<li>引用块中的无序列表项1</li>
<li>引用块中的无序列表项2</li>
</ul>

<ul>
<li>
<p>这是嵌入在li中的段落文本
</li>
</ul>

<p><img src="./新示例文档~/Images~/img示例.png" alt="img示例" /></p>

<p>![img示例](./新示例文档~/Images~/img示例.png)</p>

<p>普通文本中的<strong>加粗</strong>文本</p>

<p>普通文本中的<em>倾斜</em>文本</p>

<p class='comment'>注释文本</p>

<p class="todo"><span class='todo_u'>[-]</span> <span class='todo_up'>未开始任务</span></p>

<p><span class='date_u'> [2016-03-23 18:39][-]</span></p>

<p class="todo"><span class='todo_p'>[%]</span> <span class='todo_pp'>正在进行的任务</span></p>

<p><span class='date_p'> [2016-03-23 18:39][%]</span></p>

<p class="todo"><span class='todo_f'>[+]</span> <span class='todo_fp'><s>已完成的任务</s></span></p>

<p><span class='date_f'> [2016-03-23 18:39][+]</span></p>

<p class="todo"><span class='todo_u'>[-]</span> <span class='todo_up'>已废弃的任务</span></p>

<p><span class='date_u'> [2016-03-23 18:39][-]</span></p>

<p><span class='date'> [2016-03-23 18:39]</span> 无状态时间标签</p>

<p>　　</p>

<div class='ex_f'><p class='ex_f_t'>1．这是个【<u>　[1]　</u>】题。</p><p class='ex_f_da'><span class='ex_f_da' id='span_ah_1'>答案</span><span id='span_at_1' style = 'display: none;'>[1]填空</span></p></div><script>$(document).ready(function() {$('#span_ah_1').click(function() {$('#span_at_1').toggle();});});</script></p>

<div class='ex_c'><p class='ex_c_t'>2．这是个【　　】题。</p><ol class='ex_c_xx' type='A'><li id='li_3_0'>错项三</li><div class='ex_c_jx' id='jx_3_0' style = 'display: none;'><p><span class='ex_c_err'>错误</span>错项解析三</p></div><li id='li_3_1'>错项二</li><div class='ex_c_jx' id='jx_3_1' style = 'display: none;'><p><span class='ex_c_err'>错误</span>错项解析二</p></div><li id='li_3_2'>选择</li><div class='ex_c_jx' id='jx_3_2' style = 'display: none;'><p><span class='ex_c_right'>正确</span>答案解析</p></div><li id='li_3_3'>错项一</li><div class='ex_c_jx' id='jx_3_3' style = 'display: none;'><p><span class='ex_c_err'>错误</span>错项解析一</p></div></ol></div><script>$(document).ready(function() {$('#li_3_0').click(function() {$('#jx_3_0').toggle();});});$(document).ready(function() {$('#li_3_1').click(function() {$('#jx_3_1').toggle();});});$(document).ready(function() {$('#li_3_2').click(function() {$('#jx_3_2').toggle();});});$(document).ready(function() {$('#li_3_3').click(function() {$('#jx_3_3').toggle();});});</script></p>

<p>　　</p>

<div class='ex_m'><p class='ex_m_dy'>3．阅读下列材料：</p><div class='ex_m_cl'>
<p class='ex_m_cl'>材料文本</p><p class='ex_m_cc'>——《史记》</p></div><p>请回答：</p><p class='ex_m_q'>(1)这是个问题。<p><p class='ex_m_dy'><span class='ex_m_answer' id='ex_m_answer_4'>参考答案</span></p><p class='ex_m_da' style = 'display: none;' id='ex_m_da_4_0'>(1)这是个问题的答案。</p></div><script>$(document).ready(function() {$('#ex_m_da_4_0').click(function() {$('#ex_m_da_4_0').toggle();});});$(document).ready(function() {$('#ex_m_answer_4').click(function() {$('#ex_m_da_4_0').toggle();});});</script></p>
</div></div><br /><br /><br /><br /><br /><hr /><div class="foot"><p id="author">作者</p><p id="compile_time">2016/3/24 13:49:54</p></div></div></body></html>