CSS3截取标识符串案例编码【强烈推荐】

日期:2020-09-30 类型:科技新闻 

关键词:免费自助建站,手机建站平台,wap建站,免费自助建站平台,H5网站,H5模板建站

截取标识符串1般是用js或后台管理語言来完成,实际上应用CSS也是能够完成此实际效果的。

编码案例以下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf⑻">
<meta name="author" content="https://www.jb51.net/" />
<title>CSS实例教程-脚本制作之家</title>
<style type="text/css"> 
#first{
  width:120px;
  height:30px;
  background-color:#F30;
  overflow:hidden;
  text-overflow:clip;
  white-space:nowrap;
}
#second{
  width:120px;
  height:30px;
  background-color:#F30;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:10px;
}
</style> 
</head>
<body>
<div id="first">脚本制作之家欢迎您,仅有拼搏才会有幸福的将来</div> 
<div id="second">脚本制作之家欢迎您,仅有拼搏才会有幸福的将来</div> 
</body>
</html>

非常留意的是:不可以够省略white-space:nowrap和overflow:hidden,不然截取标识符串失效。

总结

以上所述是网编给大伙儿详细介绍的CSS3截取标识符串案例编码,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!