据我所知,CSS不是图灵完整的.但我对CSS的了解非常有限.
我想在网页上使用开关来设置段落标签的布局.
我使用了后伪元素
p:after {content: url("../img/paragraph.gif");}
Run Code Online (Sandbox Code Playgroud)
现在我需要从页面中删除此css代码.如何轻松完成(页面上已经使用了jquery)?(我不想包含或删除包含css的文件)
我有以下css:
.pageMenu .active::after {
content: '';
margin-top: -6px;
display: inline-block;
width: 0px;
height: 0px;
border-top: 14px solid white;
border-left: 14px solid transparent;
border-bottom: 14px solid white;
position: absolute;
right: 0;
}
Run Code Online (Sandbox Code Playgroud)
我想使用jQuery更改顶部,左侧和底部边框的边框宽度.我用什么选择器来访问这个元素?我尝试了以下但它似乎没有工作.
$('.pageMenu .active:after').css(
{
'border-top-width': '22px',
'border-left-width': '22px',
'border-right-width': '22px'
}
)
Run Code Online (Sandbox Code Playgroud) 我的代码是:
p {
position: relative;
background-color: blue;
}
p:before {
content: '';
position: absolute;
left:100%;
width: 10px;
height: 100%;
background-color: red;
}
Run Code Online (Sandbox Code Playgroud)
请看这个小提琴:http://jsfiddle.net/ZWw3Z/5/
我想仅在伪元素(红色位)上触发click事件.也就是说,我不希望在蓝色位上触发click事件.
我有一个页面,里面有一个图像,我用它来设置它:在CSS选择器之前.
图像是动态的,因此它没有固定的宽度; 所以我需要动态地设置:在规则的宽度之前.
我想在客户端使用JQuery来做.
假设这个:
.column:before{
width: 300px;
float: left;
content: "";
height: 430px;
}
.column{
width: 500px;
float: right;
padding: 5px;
overflow: hidden;
text-align: justify;
}
Run Code Online (Sandbox Code Playgroud)
我怎样才能:before使用JQuery 更改带有选择器的类的宽度属性(而不是没有它的那个)?
是否可以通过JavaScript更改CSS伪元素样式?
例如,我想动态设置滚动条的颜色,如下所示:
document.querySelector("#editor::-webkit-scrollbar-thumb:vertical").style.background = localStorage.getItem("Color");
Run Code Online (Sandbox Code Playgroud)
而且我也希望能够像这样告诉滚动条隐藏:
document.querySelector("#editor::-webkit-scrollbar").style.visibility = "hidden";
Run Code Online (Sandbox Code Playgroud)
但是,这两个脚本都返回:
未捕获的TypeError:无法读取null的属性'style'
还有其他方法可以解决这个问题吗?
跨浏览器的互操作性并不重要,我只需要它在webkit浏览器中工作.
我正在努力使用bootstrap 4文件浏览器.如果我使用自定义文件控件,我会一直看到选择文件值. https://v4-alpha.getbootstrap.com/components/forms/#file-browser
我想在选择文件后更改选择文件的值.这个值实际上隐藏在css中.custom-file-control:lang(en)::after,我不知道如何在javascript中访问和更改它.我可以像这样得到所选文件的值:
document.getElementById("exampleInputFile").value.split("\\").pop();
Run Code Online (Sandbox Code Playgroud)
不是我需要改变
.custom-file-control:lang(en)::after {
content: "Choose file...";
}
Run Code Online (Sandbox Code Playgroud)
不知何故
在CSS中,当您将鼠标悬停在元素上时,可以使用:hover伪类为其指定视图:
.element_class_name:hover {
/* stuff here */
}
Run Code Online (Sandbox Code Playgroud)
你如何使用jquery添加或"打开"这个伪类?通常在jQuery中,如果你想添加一个类,你会做:
$(this).addClass("class_name");
Run Code Online (Sandbox Code Playgroud)
我试过"悬停",但这实际上在元素中添加了一个名为"hover"的类.
如果有人知道该写什么,请告诉我!谢谢!
我有CSS构建的grap,它由JS动态更改.我通过伪元素显示图形最大值:
.graph:before {
content:""; //value that want set by JS
position:absolute;
top:0;
left:0;
}
Run Code Online (Sandbox Code Playgroud)
这就是我需要通过JS设置这个值的原因.我试过$(".graph:before").css("content", hh);但它没有帮助.如何获得这个价值?
假设我有标记:
<div data-generated="world!">Hello </div>
Run Code Online (Sandbox Code Playgroud)
..带CSS:
div:after {
content: attr(data-generated);
}
Run Code Online (Sandbox Code Playgroud)
这会产生文本:Hello world!- FIDDLE
div:after {
content: attr(data-generated);
}Run Code Online (Sandbox Code Playgroud)
<div data-generated="world!">Hello </div>Run Code Online (Sandbox Code Playgroud)
但...
如果我尝试选择/复制文本 - 只能选择'hello'部分.

有没有办法选择css生成的文本?
注意:
1)我已查看有关生成内容的规范(此处和此处),我没有看到任何对此问题的引用.
生成的内容应该是可搜索的,可选择的,并且可用于辅助技术
2)如果这个问题的答案是"不 - 这是不可能的" - 请链接到一个可靠的来源,说明这一点.
css ×9
javascript ×6
jquery ×6
html ×2
bootstrap-4 ×1
css-content ×1
css3 ×1
pseudo-class ×1
selection ×1