使用PHP和JavaScript防止寡妇

水深无声 2023-02-22 03:46 22阅读 0赞

One of the small touches you can add to your website is preventing "widows" in your `H1`\-`H6` tags.  For those who aren't aware, a widow (in terms of text and headings) means only one word of a title wraps to the next line -- a bit of an ugly sight if you ask me.  The way to prevent widows with just text is by adding a ` ` between the last two words of the text instead of a regular space character.  Here are two snippets for preventing widows in your website:  one using JavaScript and another using PHP!

您可以添加到网站上的一些小操作之一是防止`H1` \- `H6`标签中出现“寡妇”。 对于那些不知道的人来说，寡妇(就文字和标题而言)意味着只有一个单词的标题会绕到下一行-如果您问我，这看起来有点难看。 用文字来防止寡妇的方法是添加` ` 文本的最后两个单词之间，而不是常规空格字符之间。 这是两个防止网站上出现寡妇的代码段：一个使用JavaScript，另一个使用PHP！

// With JavaScript
    var text = text.replace(/\s(?=[^\s]*$)/g, ' ');

// With PHP
    $text = preg_replace( '|([^\s])\s+([^\s]+)\s*$|', '$1 $2', $text);

As I mentioned originally, widows are not necessarily a bug, but a small visual quirk that just doesn't look great.  Keep these regex usages handy so you can prevent such a smudge!

正如我最初提到的，寡妇并不一定是一个bug，而是一个看起来不太好的视觉怪异。 请随时使用这些正则表达式，以免弄脏！

> 翻译自: [https://davidwalsh.name/prevent-widows-php-javascript][https_davidwalsh.name_prevent-widows-php-javascript]

[https_davidwalsh.name_prevent-widows-php-javascript]: https://davidwalsh.name/prevent-widows-php-javascript