HTML5--div、span超出部分省略号显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>CSS省略号代码</title> <style type="text/css"> *{ margin: 0; padding: 0; } body { padding: 10px; font-family: Arial; } #ididid { position: absolute; width: 150px; height: 20px; line-height: 20px; text-overflow: ellipsis; white-space: normal; white-space: nowrap; overflow: hidden; } #ididid span { position: absolute; top: 0; right: 0; display: block; float: left; } #ididid span:after { content: "..."; } </style> </head> <body> <div id="ididid"> 易网时代——电脑教程丰富的网络学院<span></span></div> </body> </html>