Code blocks adorn

代码高亮

  <div class="layui-btn-container">
  <button type="button" class="layui-btn">默认按钮</button>
</div>

<p class="layui-padding-3">
AaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA
</p>

<div class="layui-btn-container">
  <button class="layui-btn layui-btn-primary layui-border-green">主色按钮</button>
</div>
<script type="text/html">
<h3>{{= d.title }}</h3>
<ul>
{{#  layui.each(d.list, function(index, item){ }}
  <li>
    <span>{{= item.modname }}</span>
    <span>{{= item.alias }}：</span>
    <span>{{= item.site || '' }}</span>
  </li>
{{#  }); }}
<p>{{#  if(d.list.length === 0){ }}
无数据
{{#  } }}</p>
</ul>
</script>
<script>
  layui.use(function () {
    var layer = layui.layer;
    const a = '1'
    function aa(a, b) {
      return '11'
    }
    layer.msg(layui.v)
  })
</script>

行高亮和聚焦

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Quick Start - Layui</title>
  <link href="//unpkg.com/layui@2.11.4/dist/css/layui.css" rel="stylesheet">
</head>
<body>
  <!-- HTML Content -->
  <script src="//unpkg.com/layui@2.11.4/dist/layui.js"></script>
  <script>
  // Usage // [!code focus:6]
  layui.use(function(){
    var layer = layui.layer;
    // Welcome
    layer.msg('Hello World', {icon: 6});
  });
  </script>
</body>
</html>

diff

<template id="test">
  <p>转义输出：{{= d.desc }}</p>
  <p>原文输出：{{- d.desc }}</p>
  {{# 注释标签 - 仅在模板中显示，不在视图中输出 }} // [!code ++]
  <p>{{! 忽略标签，可显示原始标签：
  {{# let a = 0; }} // [!code --]
  {{ let a = 0; }} // [!code ++]
  !}}
  </p>
  <p>
    条件语句：
    {{= d.list.length ? d.title : '' }}
    {{# if(d.title){}} - #AAAA{{='A'}}{{# } }} //[!code --]
    {{ if(d.title){}} - #AAAA{{='A'}}{{ } }} //[!code ++]
  </p>
  <p>循环语句：</p>
  <ul>
  {{# d.list.forEach(function(item) { }} //[!code --]
  {{ d.list.forEach(function(item) { }} //[!code ++]
  </p>
    <li>
      <span>{{= item.title }}</span>
      <span>{{= item.name }}</span>
    </li>
  {{# }); }} //[!code --]
  {{ }); }} //[!code ++]
  </ul>
  {{# if (d.list.length === 0) { }} //[!code --]
  {{ if (d.list.length === 0) { }} //[!code ++]
    无数据
  {{#} }} //[!code --]
  {{} }} //[!code ++]
</template>
<script>
  layui.use(function(){
    var laytpl = layui.laytpl;

    laytpl.config({
      tagStyle: 'modern'
    })
  })
</script>

普通示例


code line
code line
code line

code line
code line
code line
code line
code line
code line

code line
code line
code line
code line
code line
code line

code line
code line
code line
code line
code line
code line
code line
code line
code line
code line

code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line
code line

  About