技术栈

当文本内容超出容器宽度时,显示省略标记(...)

娃哈哈哈哈呀2024-02-02 20:27

当文本内容超出容器宽度时,可以使用CSS中的text-overflow属性来实现文字溢出显示小点点的效果。下面是一种常见的使用方法:

html 复制代码
<style>
 div {
            width: 200px;
            height: 18px;
            font-size: 16px;
            white-space: nowrap; /* 设置文本不换行 */
            overflow: hidden; /* 隐藏溢出部分 */
            text-overflow: ellipsis; /* 文字溢出显示省略号 */
        }
</style>

效果如下:

上一篇:设计模式学习笔记04(小滴课堂)
下一篇:Java项目:基于SSM框架实现的西安旅游管理系统(ssm+B/S架构+源码+数据库+毕业论文)
相关推荐
tq6J5Yg14
37 分钟前
windows10本地部署openclaw
前端·python
ISkp3V8b4
1 小时前
从 ReAct 到 Workflow:基于云端 API 构建事件驱动的智能体
前端·react.js·前端框架
星空
1 小时前
前端--A_1--THML标签
前端
GISer_Jing
2 小时前
前端架构师视角:Electron 知识框架全解析(含实战+面试)
前端·面试·electron
全栈练习生
2 小时前
封装数字滚动动画函数
前端
TON_G-T
2 小时前
useEffect为什么会触发死循环
java·服务器·前端
Aurorar0rua
2 小时前
CS50 x 2024 Notes C - 02
前端
海参崴-
3 小时前
C++代码格式规范
java·前端·c++
谢尔登
3 小时前
【React】setState 触发渲染的流程
前端·react.js·前端框架
摸鱼仙人~
3 小时前
Vue中markdown-it基础使用教程
前端·javascript·vue.js
热门推荐
01GitHub 镜像站点02Qwen3.5-Omni与Qwen3.6模型全面解析(含测评/案例/使用教程)03OpenClaw 请求超时 llm request timed out 怎么解决?3 种方案实测,附完整排查流程04VMware Workstation Pro 17 虚拟机完整安装教程(2026最新)05【技术干货】Gemma 4 上手深度指南:本地多模态大模型的新基线06最新更新版本,OpenClaw v2026.4.2 深度解读剖析:Task Flow 重磅回归与安全架构的全面硬化07纯 HTML/CSS/JS 实现的高颜值登录页,还会眨眼睛!少女心爆棚!08AI 编程效率翻倍:Superpowers Skills 上手清单 + 完整指南09“wsl --install -d Ubuntu-22.04”下载慢,中国地区离线安装 Ubuntu 22.04 WSL方法(亲测2025年5月6日)10UV安装并设置国内源