CSS：剧本对白 Screenplay

经验分享
1

从 标题居中后不知道怎么让标题内正文也居中【专门用来写剧本对白的格式要求对白居中】继续讨论：

对引入帖 #19 提到的 CSS 代码进行优化、修复和添加中文注释，保证功能及不影响其他非 screenplay 文档。所需 cssclasses: screenplay。

折叠三角可点击展开。

CSS 代码 
.screenplay {
  --file-line-width: 6in; /*编辑器-缩减栏宽开启时的栏宽*/
  line-height: 1.3; /*行高*/
  font-size: 16pt; /*字号*/
  & .inline-title /*外观-显示页内标题*/ {font-size: 20pt; text-align: center;}
  /*场景 h1；角色 h2；插入语 h3；转场 h4；情节 h5；对话 h2、h3后首个普通段落；==高亮== 改下划线*/
  & h1, .HyperMD-header-1 {
    font-size: inherit;
    font-weight: 600; /*粗细*/
    text-transform: uppercase; /*英文大写*/
  }
  & h2, .HyperMD-header-2 {
    font-size: inherit;
    text-align: center; /*居中*/
    text-transform: uppercase;
    margin-top: 16pt; /*同上段间距*/
  }
  & h3, .HyperMD-header-3 {
    font-size: inherit;
    padding-left: 5vw !important;
  }
  & h4, .HyperMD-header-4 {
    font-size: inherit;
    font-weight: 600;
    text-align: right; /*居右*/
  }
  & h5, .HyperMD-header-5 {
    text-align: center;
    text-decoration: underline;
  }
  & :is(h2, h3)+ p, /*导出用*/
    :is(div:has(h2), div:has(h3))+ div:has(p),
    :is(.HyperMD-header-2, .HyperMD-header-3)+ .cm-line {
    padding-left: 5vw !important; /*左间距*/
    max-width: 5in !important; /*折行宽度*/
    margin-bottom: 16pt; /*同下段间距*/
  }
  & mark, .cm-highlight {
    font-weight: 600;
    background-color: transparent !important;
    text-decoration: underline;
  }
}
@media print /*PDF导出*/ {
  .markdown-preview-view.screenplay {max-width: var(--file-line-width); margin: auto; padding: 0;}
  .screenplay hr {break-after: page; visibility: hidden;} /*水平分割线分页*/
}
示例文本 
# INT. tea session - DAY

Saimin is really concerned at how Perlad has been acting recently, he tries to bring it up but he kept dodging the questions.
## Saimin
We both know that you are barely holding it.

He advances towards the man with a serious expression.
## Perlad
### (nervously)
Sai I'm fine—

---

==高亮改下划线==
#### 转场
##### 情节

# 内景.茶会 - 白天

巴拉巴拉
## 赛民
巴拉巴拉

他严肃地接近对方。
## 佩拉德
### (紧张地)
赛，我没事——
效果展示

image
image906×725 54.2 KB

不会添加 CSS，参 CSS 分享：自动隐藏式十字花左侧边栏。
不会添加 cssclasses、对 YAML 没概念，参 故障排查指导 Troubleshooting Guide，翻到底部。

原作 PRO 版额外功能不再重复发表，见英文论坛原帖：PRO Screenwriting Snippet。

1 个赞