<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 55px;
border: 1px solid black;
}
div.a {
-webkit-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
div.b {
-webkit-hyphens: manual;
-ms-hyphens: manual;
hyphens: manual;
}
div.c {
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}
</style>
</head>
<body>
<h1>hyphens 属性</h1>
<h2>hyphens: none</h2>
<p>单词不用连字符(不换行)。</p>
<div class="a">A veryvery•very long word.</div>
<h2>hyphens: manual</h2>
<p>单词只在 ‐ 或 ­ 处有连字符(如果需要)。</p>
<div class="b">A veryvery•very long word.</div>
<h2>hyphens: auto</h2>
<p>在算法确定的位置插入单词连字符(如果需要)。</p>
<div class="c">A veryvery•very long word.</div>
</body>
</html>