html - 如何不显示 div 元素之外的链接？

Question

HTML 代码：

<p>texts and a link: <a href="https://www.apple.com/aaaaaaaaaaaaaaaaaaaaaaaaa">https://www.apple.com/aaaaaaaaaaaaaaaaaaaaaaaaa</a>

CSS 代码：

p {
    width: 100px;
    height: 600px;
    background: red;
}

在此处查看代码演示：http: //jsfiddle.net/9j4pT

从代码演示中，您可以看到链接显示在红色段落元素之外。我希望链接可以显示在红色段落元素内。有解决办法吗？HTML5 有解决方案吗？谢谢你。

Answer 1

首先你要关闭你的 p 标签</p>

然后你想要自动换行：

p {
    width: 100px;
    height: 600px;
    background: red;
    word-wrap: break-word
}

Answer 2

您还可以将溢出设置为隐藏。

p {
    width: 100px;
    height: 600px;
    background: red;
    overflow:hidden;
}

Answer 3

取决于您要寻找的结果。

如果您希望p 宽度保持不变，请使用：

p {
   word-wrap: break-word;
}

如果您希望a 宽度保持不变，请使用：

p {
   /*remove width: 100px;*/
   display: inline-block;
}