通过CSS attr()获取属性的第一部分/最后一部分

达米亚诺·马格里尼(Damiano Magrini)

是否有可能仅attr()在CSS中使用属性的第一部分我的意思是,将属性的一部分定位在某个字符(主要是空格)之前。例如,hello="foo bar"我想仅通过CSS从属性中提取foobar

真诚的,我希望答案是“否”,但我不确定。

陪同Afif

通用答案是否定的,但在某些特定情况下,我们可以找到一些技巧。由于您有一个空格作为定界符,我们可以依靠word-spacing和/或text-indent一些溢出来隐藏单词的一部分,然后调整width

这是一个例子:

.first:before {
  content: attr(data-hello);
  word-spacing: 50px;
  display: inline-block;
  vertical-align: top;
  max-width: 40px;
  overflow: hidden;
  white-space: nowrap;
}

.first:after {
  content: attr(data-hello);
  text-indent: -60px;
  word-spacing:50px;
  display: inline-block;
  vertical-align: top;
  max-width: 40px;
  overflow: hidden;
  white-space: nowrap;
}
<span class="first" data-hello="foo bar">
  some text
</span>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

通过调用第一部分提取索引第二部分

CSS选择器仅显示第一部分的内容

CSS边框-只是线的一部分

querySelect 按 css 类的一部分

使用CSS模糊图像的一部分

在CSS中隐藏边框的一部分?

剪切图像 CSS 的一部分

通过ID和分割属性值的一部分抓取查找元素

通过href属性的一部分查找元素

C#通过数组掩码获取数组的一部分

如何通过终端获取文本文件的一部分

如何仅验证我通过获取请求获得的值的一部分?

如何仅通过正则表达式检索原始数据的第一部分中的信息?

css,javascript:带有数组的随机图像加载器删除了我的变量的第一部分如何解决这个问题?

通过在php中指定第一个和最后一个位置来返回字符串的一部分

CSS / JQuery | 过滤元素时,最后一个元素的一部分不会消失

通过单击另一部分中的图像来激活页面一部分的动画

如何通过一个环境变量作为命令的一部分

仅将输入字段的一部分与CSS一起使用

!important是CSS3或CSS 2的一部分

通过电子邮件地址的一部分查找 firebase 用户?

如何通过PHP在JSON添加@符号作为对象名的一部分

状态栏停止通过工作的方式的一部分

通过Rest调用在json中传递fk作为DerivedIdentities的一部分

SQL,如何通过SELECT,WHERE子句选择项目列表的一部分?

测试的Mockito单独通过,但不能作为套件的一部分

通过迭代列表来更改字符串的一部分

Scala:通过播放框架将Json的一部分映射到Object

通过应用遮罩提取卷积神经网络特征的一部分