Heim > Artikel > Web-Frontend > String mit reinem CSS3 abfangen

String mit reinem CSS3 abfangen

php中世界最好的语言Original: 2018-06-13 14:04:231890Durchsuche

Dieses Mal werde ich Ihnen die Vorsichtsmaßnahmen für die Verwendung von reinem CSS3 zum Abfangen von Zeichenfolgen vorstellen. Das Folgende ist ein praktischer Fall, schauen wir uns das an.

Das Codebeispiel lautet wie folgt:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://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>
<p id="first">QWEQWEQWEQWE</p> 
<p id="second">QWEQWEQWEQWE</p> 
</body>
</html>

Besonderer Hinweis: white-space:nowrap und overflow:hidden dürfen nicht weggelassen werden, da sonst die abgefangene Zeichenfolge ungültig wird.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Miniprogrammentwicklung zum Erstellen einer Popup-Menüfunktion (mit Code)

Upgrade des Webpacks auf Version 4.0 Und installieren Sie webpack-cli

Das obige ist der detaillierte Inhalt vonString mit reinem CSS3 abfangen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php css3 webpack 字符串 overflow

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：20 Dinge, die Sie bei der Verwendung von CSS-Code in praktischen Frontend-Projekten beachten solltenNächster Artikel：20 Dinge, die Sie bei der Verwendung von CSS-Code in praktischen Frontend-Projekten beachten sollten

In Verbindung stehende Artikel

Mehr sehen