Maison  >  Article  >  interface Web  >  CSS implémente que si le contenu du texte dépasse la largeur définie, des points de suspension seront utilisés pour remplacer le contenu restant (code)

CSS implémente que si le contenu du texte dépasse la largeur définie, des points de suspension seront utilisés pour remplacer le contenu restant (code)

不言
不言original
2018-08-20 11:00:012049parcourir

Le contenu que cet article vous apporte concerne l'implémentation CSS. Si le contenu du texte dépasse la largeur définie, des points de suspension seront utilisés pour remplacer le contenu restant (code). Il a une certaine valeur de référence. . J'espère que cela vous sera utile.

Lorsque le CSS dépasse une certaine largeur, utilisez des ellipses... pour le remplacer. Comment y parvenir ? Le code suivant :

.content .navleft .histiry>ul{
	width: 200px;
}
.content .navleft .histiry>ul li{
	margin-left: 10px;
	height: 20px;
	line-height: 20px;	
	color: #999;	
	font-size: 12px;
	cursor:pointer;/*鼠标放上变小手*/
	word-break:keep-all;/* 不换行 */   
    white-space:nowrap;/* 不换行 */  
    overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */   
    text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一起使用。*/
}

Remarque : Les quatre dernières lignes de code changeront l'origine par défaut "•" devant ul li Nous pouvons taper un • nous-mêmes en utilisant la saisie. Ou utilisez border-radius:50% pour y parvenir.

Recommandations associées :

Implémentation CSS d'une ligne d'affichage de texte avec ellipses_html/css_WEB-ITnose

Implémentation CSS de titre au-delà des points de suspension de largeur pour représenter _html/css_WEB-ITnose

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn