这是我用来将div转换为图像并使用html2canvas.js下载的代码
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://html2canvas.hertzen.com/build/html2canvas.js"></script>
<style>
#download{
margin:10% 40%;
}
.download-btn{
padding:10px;
font-size:20px;
margin:0 20px;
}
#test{
background:#3399cc;
padding:50px;
}
.x2{
transform: scale(2,2);
}
</style>
<div id="download">
<h1 id="test">Testing Download</h1>
</div>
<center>
<button id="download-window" class="download-btn">New Window</button>
<button id="download-png" class="download-btn">Download png</button>
<button id="download-jpg" class="download-btn">Download jpg</button>
<button id="download-pngx2" class="download-btn">Download pngx2</button>
</center>
<script>
$('#download-window').click(function(){
html2canvas($('#download'),
{
onrendered: function (canvas) {
var img = canvas.toDataURL("image/png");
window.open(img);
}
});
});
$('#download-png').click(function(){
html2canvas($('#download'),
{
onrendered: function (canvas) {
var a = document.createElement('a');
a.href = canvas.toDataURL("image/png");
a.download …Run Code Online (Sandbox Code Playgroud) <select class="Select-input">
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
<option value="four">Four</option>
</select>
Run Code Online (Sandbox Code Playgroud)
我想只隐藏上面代码中的值四.
我尝试使用{display:none}作为值-4,但它不起作用.
还想在这个元素之间添加填充一,二,三和四.
PS我想只使用CSS删除它.