p::selection {/ 非IE内核 /
background: #f6c;
color: #fff;
}
但输入框不行,如果用onselect事件动态改变,是获取不到选中文本的。语法如下:
<objectstylescrollbarbasecolor ="vcolor
objectstylescrollbarArrowColor = vColor
objectstylescrollbar3dLightColor = vColor
objectstylescrollbarDarkShadowColor = vColor
其中的object为要改变对象的ID名字;
vColor为颜色的名字或RGB数值。思路就是:获取属性和属性值,拼接字符串,然后通过innerHtml将元素渲染到页面中。具体代码如下
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
block{
display: flex;
margin-bottom: 10px;
}
block label{
width: 60px;
text-align-last:justify;
text-align:justify;
text-justify:distribute-all-lines;
}
#attr, #value{
width: 220px;
line-height: 20px;
margin-left: 20px;
}
#content div{
width: 200px;
height: 200px;
color:#f00;
text-align: center;
line-height: 200px;
background-color:rgb(109, 203, 240);
}
</style>
</head>
<body>
<div class="block">
<label>属性</label>:
<input type="text" id="attr" />
</div>
<div class="block">
<label>属性值</label>:
<input type="text" id="value" />
</div>
<button onclick="setAttr()" style="margin-bottom: 20px;">设置属性</button>
<div id="content"></div>
</body>
<script>
windowonload = function(){
documentgetElementById("content")innerHTML = `<div>Javascript有点意思</div>`;
}
var style = "";
function setAttr(){
style += `${documentgetElementById("attr")value}:${documentgetElementById("value")value};`;
documentgetElementById("content")innerHTML = `<div style="${style}">Javascript有点意思</div>`;
}
</script>
</html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)