Html CSS选框仅显示与页面宽度相同的文本

我的字幕只显示与屏幕一样宽的文本。我不确定我有什么选项可以让它显示所有的文本，而不管屏幕的宽度。我知道我的

宽度：100%

风格是这里的问题

。示例1{
高度：50px；
溢出：隐藏；
位置：相对位置；
}
.例1 h3{
位置：绝对位置；
宽度：自动；
身高：100%；
保证金：0；
线高：50px；
文本对齐：居中；
/*起始位置*/
-moz变换：translateX（100%）；
-webkit转换：translateX（100%）；
转化：translateX（100%）；
/*将动画应用于此元素*/
-moz动画：示例1 15s线性无限；
-webkit动画：示例1 15s线性无限；
动画：示例1 15秒线性无限；
}
/*移动它（定义动画）*/
@-moz关键帧示例1{
0% {
-moz变换：translateX（100%）；
}
100% {
-moz变换：translateX（-100%）；
}
}
@-webkit关键帧示例1{
0% {
-webkit转换：translateX（100%）；
}
100% {
-webkit转换：translateX（-100%）；
}
}
@关键帧示例1{
0% {
-moz变换：translateX（100%）；
/*Firefox错误修复*/
-webkit转换：translateX（100%）；
/*Firefox错误修复*/
转化：translateX（100%）；
}
100% {
-moz变换：translateX（-100%）；
/*Firefox错误修复*/
-webkit转换：translateX（-100%）；
/*Firefox错误修复*/
转化：translateX（-100%）；
}
}
.示例1 h3：悬停{
-moz动画播放状态：暂停；
-webkit动画播放状态：暂停；
动画播放状态：暂停；
}

勒布朗在骑士队的比赛中设定了基调。拉简·隆多在秋天摔下了手勒布朗：耐心是骑士的关键：杰克逊：尼克斯可以让季后赛灰熊签下迈克尔·比斯利。

问题在于，您的文本正在分成新行。在

example1

类中添加一个

空白：nowrap

来解决这个问题

以下是片段：

。示例1{
高度：50px；
溢出：隐藏；
位置：相对位置；
空白：nowrap；/*如果要更改选框运行的宽度，只需调整父div的宽度即可

见下文：


。示例1{
高度：50px；
溢出：隐藏；
位置：相对位置；
/*更改此父分区的宽度*/
宽度：200px；
/*添加空白：无换行以显示所有文本*/
空白：nowrap；
}
.例1 h3{
位置：绝对位置；
宽度：自动；
身高：100%；
保证金：0；
线高：50px；
文本对齐：居中；
/*起始位置*/
-moz变换：translateX（100%）；
-webkit转换：translateX（100%）；
转化：translateX（100%）；
/*将动画应用于此元素*/
-moz动画：示例1 15s线性无限；
-webkit动画：示例1 15s线性无限；
动画：示例1 15秒线性无限；
}
/*移动它（定义动画）*/
@-moz关键帧示例1{
0% {
-moz变换：translateX（100%）；
}
100% {
-moz变换：translateX（-100%）；
}
}
@-webkit关键帧示例1{
0% {
-webkit转换：translateX（100%）；
}
100% {
-webkit转换：translateX（-100%）；
}
}
@关键帧示例1{
0% {
-moz变换：translateX（100%）；
/*Firefox错误修复*/
-webkit转换：translateX（100%）；
/*Firefox错误修复*/
转化：translateX（100%）；
}
100% {
-moz变换：translateX（-100%）；
/*Firefox错误修复*/
-webkit转换：translateX（-100%）；
/*Firefox错误修复*/
转化：translateX（-100%）；
}
}
.示例1 h3：悬停{
-moz动画播放状态：暂停；
-webkit动画播放状态：暂停；
动画播放状态：暂停；
}

勒布朗在骑士队的比赛中设定了基调。拉简·隆多在秋天摔下了手勒布朗：耐心是骑士的关键：杰克逊：尼克斯可以让季后赛灰熊签下迈克尔·比斯利。
我不完全确定是否是这样。如果我让我的浏览器填满桌面上的宽度，它会正确显示所有文本。如果我缩小它，它只显示允许的宽度，然后将其余部分剪掉。没错！这是因为文本分成新行以适应当前屏幕宽度。通过添加
空白：nowrap
您只有一行文本，可以实现预期的结果。啊，我现在明白了。谢谢：）我已经接受了以前的答案，但这也行。不客气！我认为重要的是要注意，另一个答案不能解决问题，因为它使用静态宽度。如果您更改为更大的文本，width需要手动调整。通过添加
空白：nowrap
，您不必调整宽度。在我看来，这是一种更好的方法，因为它是动态的。您可以编写整个“Lorem Ipsum”它仍然可以工作！啊，那很简单啊。这就是问题所在。出于我个人的好奇-我可以在父div中添加任何宽度，然后字幕显示所有文本。即使宽度很小，比如50 px。但是如果我从父div中完全删除宽度样式，文本只会显示，直到达到页面宽度为止hed。很好奇为什么会这样？这就是问题所在，谢谢！当你没有在div中指定宽度时，宽度是由它的父元素定义的。在你的例子中，div的主体宽度是100%。@JimmyBlundell-我的答案也有
空白：nowrap
，并解决了宽度问题。另一个答案只说明了问题对于无包装且未显示宽度示例…-很遗憾您删除了接受的答案，但很高兴您的问题得到解决。