rainbow
rainbow copied to clipboard
use html tag is wrong
when i use rainbow occure something not good
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>示例</title>
<link rel="stylesheet" type="text/css" href="./lib/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./lib/monokai.css">
</head>
<body>
<h3>代码示例</h3>
<pre>
<code data-language="html">
<div class="alert-content">
<div class="alert-txt">我是内容区域我是内容区域我是内容区是内容区区域我是内容区域我是内容区域</div></div>
<div class="btn-common alert-form">
<div class="btn-cancle">取消</div>
<div class="btn-submit">确定</div>
</div>
</code>
</pre>
<script src="./lib/rainbow.min.js"></script>
</body>
</html>
html end tag not right。 i don't know what to do .

Hello, your issues occur because of bootstrap.css. It has .close selector in the global scope.
As for me, quick solution - overwrite all values properties for .class
pre .close {
float: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
text-shadow: none;
filter: inherit;
opacity: inherit;
}
pre .close:focus,
pre .close:hover {
text-decoration: inherit;
cursor: inherit;
filter: inherit;
opacity: inherit;
}
But stay some issue with close:focus, close:hover. I think that you need just to overwrite manual depending on your theme.