将句子的首字母大写 CSS
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11129696/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Capitalize first letter of sentences CSS
提问by 1907
I want to capitalize the first letter of sentences, and also the first letter after commas if possible. I want to add the code in here:
如果可能的话，我想大写句子的第一个字母，以及逗号后的第一个字母。我想在这里添加代码：
.qcont {
width: 550px;
height: auto;
float: right;
overflow: hidden;
position: relative;
}
回答by LuudJacobs
You can capitalize the first letter of the .qcontelement by using the pseudo-element :first-letter.
您可以.qcont使用伪元素将元素的第一个字母大写:first-letter。
.qcont:first-letter{
text-transform: capitalize
}
This is the closest you're gonna get using only css. You could use javascript (in combination with jQuery) to wrap each letter which comes after a period (or comma, like you wish) in a span. You could add the same css as above to that span. Or do it in javascript all together.
这是您仅使用 css 将获得的最接近的结果。您可以使用 javascript（与 jQuery 结合使用）将句点（或逗号，如您所愿）之后的每个字母包装在span. 您可以将与上面相同的 css 添加到span. 或者一起在javascript中完成。
Here's a snippet for the css approach:
这是 css 方法的一个片段：
.qcont:first-letter {
text-transform: capitalize
}<p class="qcont">word, another word</p>回答by Jukka K. Korpela
This cannot be done in CSS. The text-transformproperty makes no distinction according to the placement of a word inside the content, and there is no pseudo-element for selecting the first word of a sentence. You would need to have real elements, in markup, for each sentence. But if you can do that, then you could probably just as well change the initial letters to uppercase in the content proper.
这不能在 CSS 中完成。该text-transform属性不根据单词在内容中的位置进行区分，也没有用于选择句子第一个单词的伪元素。对于每个句子，您都需要在标记中包含真实元素。但是，如果您可以这样做，那么您也可以将内容中的首字母更改为大写。
Capitalization at the start of a sentence is a matter of orthography and should be done when generating the content, not with optional stylistic suggestions (CSS) or with client-side scripting. The process of recognizing sentence boundaries is far from trivial and cannot in general be performed automatically without complex syntactic and semantic analysis (e.g., an abbreviation ending with a period may appear inside a sentence or at the end of a sentence).
句子开头的大写是拼写问题，应该在生成内容时完成，而不是使用可选的样式建议 (CSS) 或客户端脚本。识别句子边界的过程绝非易事，如果没有复杂的句法和语义分析（例如，以句号结尾的缩写可能出现在句子内部或句子末尾），通常无法自动执行。
回答by Alessandro Foolish Ciak DAnton
If you need to capitalize the first letter in contenteditable container you can't use the css property
如果您需要将 contenteditable 容器中的第一个字母大写，则不能使用 css 属性
#myContentEditableDiv:first-letter {
text-transform: capitalize;
}
because when you try to delete a letter automatically you will delete all the text contained in the contenteditable.
因为当您尝试自动删除一个字母时，您将删除 contenteditable 中包含的所有文本。
Try instead the example provided by sakhunzai in https://stackoverflow.com/a/7242079/6411398for a working solution.
尝试使用 sakhunzai 在https://stackoverflow.com/a/7242079/6411398 中提供的示例 以获得有效的解决方案。
回答by kristina childs
text-transform:capitalize;will capitalize the first letter of a sentence, but if you want to also do it for commas you will have to write some javascript. I agree with @BoltClock, though. Why on earth would you want to capitalize after a comma?
text-transform:capitalize;将大写一个句子的第一个字母，但如果你也想用逗号来做，你将不得不写一些 javascript。不过，我同意@BoltClock。为什么要在逗号后大写？
Edit:For the sake of readers: text-transform:capitalize;will capitalize each word of a sentence, not the first one only.
You must use the :first-letterCSS selector with the above.
编辑：为读者着想：text-transform:capitalize;将句子的每个单词大写，而不是第一个。您必须:first-letter在上面使用CSS 选择器。
