实时编辑模式下,怎么做首字下沉效果

ai捣鼓了一个多小时 也没做到
只有阅读模式可以

image

刚说完 ai就给了一个 能用的

/*
 * All Paragraphs Drop Cap (Theme-Aware Color)
 * 自动匹配主题颜色,不改变字体,兼容实时预览和阅读模式
 */

/* --- Reading Mode --- */
.markdown-reading-view p:not(pre p)::first-letter,

/* --- Live Preview Mode --- */
.markdown-source-view.is-live-preview .cm-line:not(.HyperMD-header, .HyperMD-list-line, .HyperMD-quote, .HyperMD-codeblock, .task-list-item-line, .cm-active)::first-letter {
    /* 核心样式 */
    font-size: 3em; /* 调整大小 */
    font-weight: 600; /* 比 bold 稍细一点的字重 */
    float: left;
    line-height: 0.8; /* 垂直对齐 */
    padding: 0.05em 0.1em 0 0;
    margin-right: 0.05em;

    /* 颜色设置:使用 CSS 变量来自动获取主题的强调色 */
    color: #ffffff;

    /* 可选:添加一点微妙的阴影增加质感 */
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
    
    display: inline-block;
}