我正在使用一个自编的编号列表.如何读取start属性并使用CSS将其添加到计数器?
HTML
<ol>
<li>Number One</li>
<li>Number Two</li>
<li>Number Three</li>
</ol>
<ol start="10">
<li>Number Ten</li>
<li>Number Eleven</li>
<li>Number Twelve</li>
</ol>
Run Code Online (Sandbox Code Playgroud)
CSS
ol {
list-style-type: none;
/* this does not work like I expected */
counter-reset: lis attr(start, number, 0);
}
li {
counter-increment: lis
}
li:before {
content: counter(lis)". ";
color: red;
}
Run Code Online (Sandbox Code Playgroud)
我想知道是否有可能修改一个HTMLInputElement显示不同于值prop的东西.
为什么?好吧,有时您想要向用户显示类似字符串的内容,但您想要将ID发布到服务器.如果您在输入上使用多个逻辑/插件,那么使用额外的伪造插件就会出现问题.那么为什么不把两者都包括在一起?!=)
我已经注意到可以为value道具定义一个吸气剂.但是我放弃了原生的setter功能,它将改变显示的文本.= /
HTML:
<input id="foobar" type="text"/>
Run Code Online (Sandbox Code Playgroud)
JS:
var input = document.getElementById('foobar');
input.value = 'Mr. Foo Bar';
input.myHiddenValue = 123;
Object.defineProperty(input, 'value', {
get: function(){
return this.myHiddenValue;
}
});
Run Code Online (Sandbox Code Playgroud)
所以,如果你能告诉我,如果这是可能的,并保持本地制定者或只是一个愚蠢的深夜想法,让我知道xD
我有一个固定的导航侧边栏,并希望在子级别上为上滑/下滑动画使用过渡。出于某种未知原因,Chrome 在制作动画时会滚动页面。因为这仅在 Chrome 中发生,所以它可能是一个错误。有人知道出了什么问题吗?
html,body {
margin: 0;
padding: 0;
color: white;
}
#content {
position: relative;
height: 4000px;
overflow: auto;
background: grey;
}
#fixed {
position: fixed;
right: 0;
top: 0;
height: 100vh;
width: 200px;
background: red;
overflow-x: hidden
overflow-y: auto;
}
#test {
max-height: 0;
background: blue;
transition: max-height 0.5s, padding-bottom 0.5s;
overflow: hidden;
}
#test:target {
max-height: 50vh;
}
#testContent {
height: 200px;
background: green;
}Run Code Online (Sandbox Code Playgroud)
<div id="content">
<div id="fixed">
<a href="#test">Open Test</a><br/>
<a href="#">Close Test</a><br/>
<div …Run Code Online (Sandbox Code Playgroud)