js卷曲_卷曲的下划线

js卷曲

Ever wanted to use un underline on a web page that looks like a spelling mistake in Word? You know, the curly red underline. It's actually very easy.

是否曾经想过在看起来像Word中的拼写错误的网页上使用un下划线？ 你知道的，红色的下划线。 实际上非常简单。

Here's an example.

这是一个例子。

All you need is:

所有你需要的是：

• 

  A small piece of the wavy line, like this (it's stretched here for the demo purpose)

  波浪线的一小部分，像这样(此处出于演示目的而进行了拉伸)

• A style that uses the image as background
  一种使用图像作为背景的样式
• Align the background at the bottom and repeat only on the x-axis
  在底部对齐背景，仅在x轴上重复

The style definition would look like:

样式定义如下所示：

.curly-underline {
    background: url(underline.gif) bottom repeat-x;
}

And that's it!

就是这样！

I saw this working in TinyMCE, the WYSIWYG editor used by WordPress, for displaying spelling mistakes. Really cool!

我在WordPress使用的WYSIWYG编辑器TinyMCE中看到了此功能，用于显示拼写错误。 真酷！

Note: If you're a frequent visitor to my site and the example doesn't work for you, chances are you're using a cached version of the CSS file.

注意：如果您经常访问我的网站，但该示例不适合您，则很可能您正在使用CSS文件的缓存版本。

Tell your friends about this post on Facebook and Twitter

在Facebook和Twitter上告诉您的朋友有关此帖子的信息

翻译自: https://www.phpied.com/curly-underline/

js卷曲