layui/docs/dropdown/detail/demo.md

<h3 lay-toc="{level: 2, id: 'examples', hot: true}" class="layui-hide">基础用法</h3>

<pre class="layui-code" lay-options="{preview: true, text: {preview: '基础用法'}, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/base.md") }}
  </textarea>
</pre>

<h3 id="demo-complex" lay-toc="{level: 2, hot: true}">复杂结构</h3>

<pre class="layui-code" lay-options="{preview: true, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/complex.md") }}
  </textarea>
</pre>

<h3 id="demo-table" lay-toc="{level: 2, hot: true}">在表格中应用</h3>

<pre class="layui-code" lay-options="{preview: true, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/table.md") }}
  </textarea>
</pre>

<h3 id="demo-on" lay-toc="{level: 2}">自定义事件</h3>

<pre class="layui-code" lay-options="{preview: true, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/on.md") }}
  </textarea>
</pre>

<h3 id="demo-contextmenu" lay-toc="{level: 2, hot: true}">右键菜单</h3>

<pre class="layui-code" lay-options="{preview: true, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/contextmenu.md") }}
  </textarea>
</pre>

<h3 id="demo-align" lay-toc="{level: 2}">水平对齐方式</h3>

<pre class="layui-code" lay-options="{preview: true, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/align.md") }}
  </textarea>
</pre>

<h3 id="demo-content" lay-toc="{level: 2, hot: true}">自定义内容</h3>

如下以弹出一个 `tab` 为例

<pre class="layui-code" lay-options="{preview: true, codeStyle: 'height: 535px;', layout: ['preview', 'code'], tools: ['full']}">
  <textarea>
{{- d.include("/dropdown/examples/content.md") }}
  </textarea>
</pre>