css怎样隐藏元素多出的部分
在css中，可以利用overflow属性隐藏元素多出的部分，只需要给元素添加“overflow:hidden”样式即可；该属性值设置为hidden时，超出元素框的元素内容就会被裁剪不显示。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
css怎样隐藏元素多出的部分
在css中，可以将元素的overflow属性设置为hidden，实现超出部分隐藏。下面举例讲解css如何设置超出部分隐藏。
1、新建一个html文件，命名为test.html，用于讲解css如何设置超出部分隐藏。使用div标签创建一行文字，用于测试。设置div标签的class属性为txtdiv，用于下面通过该class定义其样式。
通过class设置div的样式，定义其宽度为100px，高度为25px，背景颜色为灰色。
2、在css标签内，再使用“overflow:hidden”来设置当div内的文字超过宽度时，隐藏不显示。
在浏览器打开test.html文件，查看结果。
总结：
1、使用div标签创建一行文字，设置div标签的class属性为txtdiv。
2、在css标签内，通过class设置div的样式，定义其宽度，高度，再使用“overflow:hidden”来设置当div内的文字超过宽度时，隐藏不显示。
注意事项：
若想超出部分以省略号显示，还需要加上text-overflow:ellipsis和white-space: nowrap设置。
（学习视频分享：css视频教程）
以上就是css怎样隐藏元素多出的部分的详细内容！
相关内容
-
css如何实现显示和隐藏
css实现显示隐藏的方法：1、使用display属性，语法“display:none|block;”隐藏和显示html元素；2、使用visibility属性，语法“visibi...
-
css如何设置超出部分隐藏
css设置超出部分隐藏的方法：首先新建文件，并使用div标签创建文字；然后设置div标签的class属性为txtdiv；接着通过class设置div的样式；最后再使用“over...
-
css如何隐藏标签
方法：1、使用“opacity:0”语句；2、使用“display:none”语句；3、使用“visibility:hidden”语句；4、使用position属性，配合top...
-
css怎么让div隐藏
css让div隐藏方法：1、使用“display:none;”语句；2、使用“visibility:hidden;”语句；3、使用“opacity:0;”语句；4、使用“pos...
-
css怎么实现鼠标经过显示离开隐藏效果
实现方法：1、给元素添加“display:none;”样式，将元素先隐藏起来；2、使用“:hover”选择器和“display:block;”样式设置鼠标经过显示效果，语法“父...
-
css怎样隐藏行元素
css隐藏行元素的方法：1、利用display属性，只需要给行元素添加“display:none”样式即可；2、利用visibility属性，只需要给行元素添加“visibil...
-
css怎样隐藏父元素显示子元素
在css中，可以利用visibility属性实现父元素隐藏并且子元素显示的效果，只需要给父元素添加“visibility:hidden”样式、给子元素添加“visibility...
-
css怎么控制按钮不可用
方法：给按钮元素添加“pointer-events:none;”样式来让按钮元素永远不会成为鼠标事件的target，让其点击事件失效，即可控制按钮不可用。本教程操作环境：win...
-
css如何设置一行字显示不完隐藏
css中可利用overflow属性来设置一行字显示不完就隐藏；只需给文字的盒子元素添加“overflow:hidden;”样式，设置当内容溢出元素框时，将文字内容修剪，且溢出部...
-
CSS外链式与内联式的区别是什么
区别：CSS外链式是将css代码单独写一个以“.css”为扩展名的文件中，然后使用link标签链接到html中。CSS内联式是直接使用style属性将css代码写在HTML标签...
