正则式

<title>🚨正则式</title>

<style>
  
      * {
        margin: 0;
        padding: 0;        
        }
                    
    .b  {
        white-space: nowrap; /* 防止换行 */
        overflow: hidden;    /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 添加省略号表示溢出 */
        display: inline-block; /* 使其适应内容宽度 */
        font-family: KaiTi;
        font-size: 24px;
        color: #00e500;
        }

.highlight {
        color: red;
        font-weight: bold;
        }

.video-container{
display: flex;
justify-content: right;
align-items: center;
height: 100vh;
}

    body {
        background-color: #282A36;
        padding-top: 60px; /* 根据工具栏的高度调整 */
        color: #f5f5f5;
        line-height: 1.6;
        margin-left: 350px;
        margin-right: 200px; /* 根据目录宽度调整 */
        font-family: Arial, sans-serif;
        counter-reset: section;
        display: flex;
        flex-direction: column;
        align-items: flex-start; /* 所有内容左对齐 */
        }
  
h1, h2, h3 {
        color: #4592af;
        margin-left: 2px;
        white-space: nowrap;     /* 防止换行 */
        overflow: hidden;        /* 隐藏溢出内容 */
        text-overflow: ellipsis; /* 添加省略号表示溢出 */
        margin-top: 2px;
        margin-bottom: -1px;
        display: block;          /* 确保是块级元素 */
        font-size: 24px; /* 根据需要调整 */
        }

    #toc {
        position: fixed;
        top: 5px;
        left: 5px;
        max-height: 90vh; /* 设置最大高度为视口高度的80% */
        max-width: 45vh;
        overflow-y: auto; /* 添加垂直滚动条 */
        background-color: rgba(40, 42, 54, 0.9); /* 半透明背景 */
        padding: 20px;
        border-radius: 5px;
        box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
                font-size: 14px; /* 根据需要调整 */
        }

   #toc ul {
        list-style-type: none;
        padding: 0;
        margin: 0;
        counter-reset: section; /* 重置计数器 */
        }

  #toc li {
        counter-increment: section;
        }

#toc li::before {
content: counter(section) ". ";
color: #FF0000;
}

   #toc a {
        color: #4592af;
        text-decoration: none;
        }

#toc a:hover {
text-decoration: underline;
}

 body > h2 {
        counter-increment: section;
        }

body > h2::before{
content: counter(section) ". ";
color: #ff461f;
}
.code {
font-family: monospace;
background-color: #f4f4f4;
padding: 5px;
border: 1px solid #ccc;
white-space: pre-wrap; /* 保持格式 */
}
</style>

</head>

正则表达式

<div id="toc">
    <!--<h2>目录</h2>-->
    <ul id="toc-list">
        <!-- 目录项将由JavaScript生成 -->
    </ul>
</div>

【回车】和【换行】

在机械英文打字机上，有一个部件叫"字车"（carriage），每打一个单词，"字车"就前进一格。
当打满一行字符后，打字者就得推动"字车"到起始位置，这时打字机会有两个动作响应：
一是："字车"被归位（carriage return，回到最左端），这个推动"字车"的动作叫"回车"（carriage return）。
二是：滚筒上卷一行（line feed），以便开始输入下一行。
所以合并起来就是CRLF = Carriage Return & Line Feed。