mirror of https://github.com/layui/layui
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
132 lines
2.2 KiB
132 lines
2.2 KiB
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta charset="utf-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> |
|
<title>Code blocks adorn - Layui</title> |
|
|
|
<link href="../src/css/layui.css" rel="stylesheet"> |
|
<style> |
|
body{padding: 32px;} |
|
pre{margin-bottom: 20px;} |
|
</style> |
|
</head> |
|
<body> |
|
|
|
<pre class="layui-code" lay-height="300px"> |
|
// 在里面存放任意的文本内容 |
|
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 |
|
</pre> |
|
|
|
<pre class="layui-code" lay-options="{title: '不显示行号', ln: false}"> |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
</pre> |
|
|
|
<pre class="layui-code" lay-options="{title: '深色风格', skin: 'dark'}"> |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
</pre> |
|
|
|
<pre class="layui-code" lay-options="{title: '嵌套', encode: false}"> |
|
code line |
|
code line |
|
code line |
|
code line |
|
<pre class="layui-code" lay-options="{ln: false, encode: false}"> |
|
code line |
|
code line |
|
code line |
|
<pre class="layui-code"> |
|
code line |
|
code line |
|
code line |
|
</pre> |
|
</pre> |
|
</pre> |
|
|
|
<pre class="layui-code" lay-options="{skin: 'dark', encode: false}"> |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
<pre class="layui-code" lay-options="{skin: 'dark', encode: false}"> |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
<pre class="layui-code" lay-options="{skin: 'dark', ln: false, encode: false}"> |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
code line |
|
</pre> |
|
</pre> |
|
</pre> |
|
</pre> |
|
|
|
<pre class="layui-code" lay-options="{encode: true}"> |
|
<div> |
|
123 |
|
</div> |
|
</pre> |
|
|
|
<pre class="layui-code" lay-about="code"> |
|
About |
|
</pre> |
|
|
|
<pre id="custom1"> |
|
custom more about |
|
</pre> |
|
|
|
|
|
<script src="../src/layui.js"></script> |
|
<script> |
|
layui.use('code', function(){ |
|
// 通用实例，根据元素属性定制化参数 |
|
layui.code({ |
|
//about: 'code' // 右上角默认显示 code |
|
}); |
|
|
|
// custom more about |
|
layui.code({ |
|
elem: '#custom1', |
|
about: [ |
|
'<a href="javascript:;">复制</a>', |
|
'<a href="about:blank" target="_blank">跳转</a>' |
|
].join('') |
|
}) |
|
}); |
|
</script> |
|
</body> |
|
</html>
|
|
|