使用css修剪字符串

我想使用css修剪字符串。 例子 我的绳子是

“嗨，谷歌你好吗？”

我想得到输出

“嗨”

---

得到前两个字母。使用Css可以修剪字符串

CSS是一种描述页面元素样式的方法。您试图使用一个框架来编辑页面内容，该框架设计为不影响页面内容，只影响页面样式

---

您可能应该考虑使用JavaScript做您想做的事情。用这种方式格式化页面元素在CSS中是不可能的。

AFAIK：在CSS中没有这样做的方法。实现所需功能的唯一方法是使用一些脚本语言（例如JavaScript）。

这是CSS所无法做到的

唯一可能的解决办法是将句子的其余部分用一个空格括起来，然后隐藏起来，如下所示：

<p>hi<span> google how are you</span></p>

span { display: none; }

你好，谷歌你好吗

span{显示：无；}

---

或者您应该研究Javascript或PHP解决方案。

CSS本身不是一种编程语言

另一方面，有好消息要告诉你。您可以使用JavaScript或jQuery等编程语言来完成此任务，甚至可以使用PHP或Ruby等后端编程语言

CSS是一种用于以级联方式应用样式的语言，因此它被称为CSS（级联样式表）

只是给你一些建议，你想要完成的不是

trim

。修剪是从字符串中删除不必要的空格，如此处所示的示例：

您试图完成的任务称为子字符串，如下所述：

---

我个人会用Javascript来实现这一点

var startText = "hi google how are you";
var endText = startText.substr(0, 3); 
// endText is now "hi"

---

虽然不可能使用CSS；但在理想状态下，你可能会产生幻觉，这可能是你的解决办法。我在这里使用了

文本溢出：省略号
您可以检查

<p>hi google how are you</p>

p {
    text-overflow: ellipsis;   /* IE, Safari (WebKit) */
    overflow:hidden;              /* don't show excess chars */
    white-space:nowrap;           /* force single line */
    width: 17px;  /*This property playing a major role just showing the first 2 letter*/
}

你好，谷歌你好吗

p{
文本溢出：省略号；/*IE，Safari（WebKit）*/
溢出：隐藏；/*不显示多余字符*/
空白：nowrap；/*强制单线*/
宽度：17px；/*此属性仅显示前两个字母，起主要作用*/
}

我不太清楚你为什么要用CSS（用JS或你的后端服务器端语言更合理），我想这是因为你想用一个屏幕大小，比如说完整的句子，另一个屏幕大小是缩写的？如果是这样的话，不幸的是CSS无法做到这一点，但是您可以在HTML中执行类似的操作：

<span class="widescreen-span">[pull full string here]</span>
<span class="smallscreen-span">[trimmed string here]</span>

然后在smallscreen.css中，您可以执行以下操作：

.widescreen-span { display:inline; }
.smallscreen-span { display:none; }

.widescreen-span { display:none; }
.smallscreen-span { display:inline; }

---

使用Css是否可以修剪字符串。

-不，可以使用的方法之一是将宽度设置为前两个字母的宽度，例如使用

溢出：隐藏
。这不会修剪它，但会明显地只显示前两个字母。谢谢尼克。我认为这是唯一的解决方案。@Biju s我已经为你做了一个演示。但这只是给人一种文本被截断的错觉。谢谢Kheema的演示，它的作品。我认为没有其他解决办法。你可以通过接受答案来结束这个问题。我如何结束这个问题？单击绿色复选标记按钮，你可以结束这个问题，也可以放弃投票。
.widescreen-span { display:inline; }
.smallscreen-span { display:none; }

.widescreen-span { display:none; }
.smallscreen-span { display:inline; }