在HTML中创建网格
在HTML中创建网格
提问于 2018-01-12 00:38:08
我希望创建一个这样的网格：Grid
我使用的是：
$(document).ready(function() {
for (var i = 0; i < 366; i++) {
$('#div-padre').append('<div class="dia" id="div'+ i +'" /> ');
}
});要生成365个div，然后使用CSS创建“grid”样式。
.dia {
width: 45px;
height: 45px;
background: white;
outline: 2px solid;
float: left;
}
.div-padre {
width: 800px;
}我试着清理，但最后的div出了问题，我不关心它们是div，tr还是什么，但在将来我想选择一个正方形并改变颜色，所以div或tr之类的，我需要你以后再做
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-01-12 00:43:41
这是一个边框/轮廓管理问题，看看这个：
$(document).ready(function() {
for (var i = 0; i < 366; i++) {
$('#div-padre').append('<div class="dia" id="div'+ i +'" /> ');
}
});.dia {
width: 45px;
height: 45px;
background: white;
border: 2px solid;
float: left;
margin-top:-2px;
margin-left:-2px;
}
.div-padre {
width: 800px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div-padre"></div>
Stack Overflow用户
发布于 2018-01-12 00:45:59
使用border: 2px solid; margin: -1px;而不是outline: 2px solid;
$(document).ready(function() {
for (var i = 0; i < 365; i++) {
$('#div-padre')
.append(
$('<div>', {
id: 'div-' + (i+1),
class: 'dia'
}));
}
});.dia {
width: 45px;
height: 45px;
background: white;
border: 2px solid;
margin: -1px;
float: left;
}
.div-padre {
width: 800px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div-padre"></div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/48211930
复制相关文章
相似问题
腾讯云开发者
