如何创建一个由按钮组成的网格，为它们命名(即使我用“for”来创建它们)
创建一个由按钮组成的网格，可以使用HTML和CSS来实现。首先，我们需要创建一个HTML文件，并在文件中添加一个按钮网格的容器。然后，通过CSS来设置按钮的样式和位置，并使用JavaScript来为每个按钮添加名称。
以下是一个示例的HTML代码：
<!DOCTYPE html>
<html>
<head>
<style>
.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr); /* 指定网格列数为3 */
grid-gap: 10px; /* 指定网格间距为10像素 */
}
.grid-item {
padding: 20px;
text-align: center;
background-color: #f1f1f1;
}
</style>
</head>
<body>
<div class="grid-container">
<div class="grid-item" id="button1"></div>
<div class="grid-item" id="button2"></div>
<div class="grid-item" id="button3"></div>
<div class="grid-item" id="button4"></div>
<div class="grid-item" id="button5"></div>
<div class="grid-item" id="button6"></div>
</div>
<script>
var buttons = document.getElementsByClassName("grid-item"); // 获取所有按钮元素
for (var i = 0; i < buttons.length; i++) {
buttons[i].textContent = "Button " + (i + 1); // 为按钮设置名称
}
</script>
</body>
</html>在这个示例中，我们使用了CSS的grid布局来创建一个具有3列的网格容器。每个网格项都是一个按钮，通过设置grid-item类来指定它们的样式。在JavaScript部分，我们使用了getElementsByClassName方法来获取所有的按钮元素，并使用循环为每个按钮设置名称。
请注意，上述代码仅为示例，您可以根据实际需求自定义样式和布局。如果需要更多按钮，可以在网格容器中添加更多的grid-item元素。
相关·内容
我最近看到一个关于“如何制作一个大小自动变化的按钮网格”的问题。我在那里发现了一个非常有趣的代码示例，然而，所提出的方法在"for“中创建了按钮，这不允许将它们设置为特定的参数。Grid.columnconfigure(frame, x, weight = 1)
for y in
浏览 4提问于2019-10-16得票数 0
1回答
我在AutoCAD中有一个图层，它由许多矩形多边形(用多边形创建)组成，它们的大小是相同的。就像网格一样。我在它的底部还有另一层，它由许多多条线组成--城市边界，森林和农业地区。现在，我想“切割”第二个根据网格，以便所有的多边形将被分割在每个矩形的网格大小。
在AutoCAD
浏览 1提问于2014-11-27得票数 0
回答已采纳
1回答
我有5 ，我最重的标签由1 组成。如果我用1000行和50列初始化它(根据它们的演示，这应该是可以的)，将选项卡从一个更改到另一个变得非常慢(“非网格选项卡”为8-18秒，“网格选项卡”为22-崩溃秒)。即使我禁用了面板转换之间的动画，它也是缓慢的<
浏览 6提问于2015-07-15得票数 0
回答已采纳
1回答
模式发现游戏
、、
这是一种基于策略和猜测的游戏。这些字母需要在buttons[0] - buttons[3]上的每个按钮上以ABCD的方式匹配.和buttons[n] - buttons[n]在每个正方形，有点像一个矩阵，虽然没有涉及矩阵的数学。游戏就是这样开始的：每次用户单击"A“按钮时，按钮的文本都会对ABCD序列中的所有buttons[n]进行更改，要想获胜，您需要将每个控件的
浏览 0提问于2015-09-03得票数 11
回答已采纳
1回答
我想要建立由8个按钮(2x4)组成的网格，并且能够使用键盘箭头移动这个按钮。如果我只是做一个网格布局，并将按钮放在相应的坐标中，我得到的布局看起来像应该的那样，但我只能向左和向右移动，当我到达第一行的末尾时，焦点跳到第二行的第一个按钮上(即向上按钮<
浏览 2提问于2013-10-02得票数 0
回答已采纳
1回答
我正在制作一个由30 x 30个按钮组成的网格，用BS_BITMAP表示一些数值，可以通过点击按钮来设置。那么我是不是应该在一个窗口上创建900个按钮，或者GDI可以帮助我做同样的事情呢？关于将网格中某列的一行设置为某些值，您有什么想法吗？我需要一个
浏览 0提问于2010-08-31得票数 0
回答已采纳
下面是一个例子。我有一个由不同按钮组成的网格(将每个按钮添加到grid布局中)，我不想为每个按钮命名，而是希望对每个按钮执行不同的命令。当重写actionPerformed时，我如何区分它们的区别？
浏览 2提问于2016-05-29得票数 0
回答已采纳
我创建了一个具有圆角的简单按钮，该按钮由以下内容组成：
这就是我所忘记的：“还请记住，即使设置了scale9Grid属性，所有文本和子电影剪辑也会正常缩放，而不管它们位于scale9网格的哪个区域。”我已经为所有的movieclips设置了一个
浏览 2提问于2009-06-20得票数 0
回答已采纳
1回答
我有一个2列3行的QGrid。第一列由QPushButtons组成，第二列由QLabel组成，按钮=> "This Button"，“The Button"，"A Button”。按下一行中的按钮应通过添加1来更改同一行中标签的文本(编号)。<em
浏览 0提问于2017-11-17得票数 0
回答已采纳
1回答
所以，我试图把骨头和搅拌器中的顶点连接起来，但是我一直失败。如果我在XNA中移动一个骨头，它也不会移动那些连接到这个骨头的顶点(顶点组)。我所做的是：-then我为每个网格创建了顶点组，并将顶点分配给这些组。
-now<
浏览 0提问于2013-01-28得票数 1
我已经能够创建由多列检查组成的网格视图。我正在开发web应用程序，我不能保存多列检查的状态，并在一次单击按钮上更新它们。
浏览 0提问于2013-12-19得票数 1
我试图在我的Angular 11应用程序中创建一个模板，但它无法识别其中的数据。 我们有一个Kendo网格，我们希望第一列由一个按钮组成，当单击该按钮时会弹出一个菜单。所以我创建了一个组件来充当按钮和菜单： ? 如你所见，菜单中有3个菜。但有一些网格
浏览 42提问于2021-10-05得票数 0
我正试图用matplotlib创建一个由大约2000万个数据点组成的散点图。即使在将alpha值设置为最低之后，在没有任何可见数据之前，结果也只是一个完全黑色的情节。X轴是约2个月的连续时间轴，y轴由150 k个连续整数值组成。
是否有任何方法来绘制所有的点，使它们随时间的分布仍然是可见<em
浏览 0提问于2013-09-18得票数 7
回答已采纳
我正在尝试创建一个由12个按钮组成的网格，由3个项目组成。当前，代码运行并在网格中创建12个按钮，但每个按钮都是列表中的最后一个项。不确定如何存储或保存每一行的列表项。testList:
tk.Button(text=i,padx=50, pady=5
浏览 4提问于2020-09-03得票数 0
回答已采纳
1回答
我在基本概念上遇到了麻烦，比如类如何相互通信，如何使用私有实例变量，如何使用ArrayList，如何比较JLabels或将它们设置为可比较的东西……我可以使用两个四个循环来创建GUI，游戏是一个由7列6个棋子组成的网格。图形用
浏览 0提问于2014-05-04得票数 0
1回答
我在一家网上商店工作。我们确实有一些示例产品：
问题是“添加到购物车”按钮总是在不同的高度。按钮应该始终是30px以上的底部-无论有多少内容。如果你想在线查看：
我试着用不同的值来使用Flex-box，但是我现在卡住了。
浏览 13提问于2019-10-26得票数 2
回答已采纳
2回答
我有一个10x10的网格，里面充满了按钮，文本框和图片，每一个都只是跨越到它的单个单元格，它们永远不会混合在一起，我想引用一个单元格中的某个对象并更改它的一个属性，例如，更改单元格1,3 (行，列)中按钮的内容下面是我的XAML的一个简短示例：
<Gr
浏览 1提问于2010-11-29得票数 0
回答已采纳
1回答
在JavaFX中，可以使用向网格中的用户显示多个UI元素。Vaadin有一个，但是它们的不能作为其他元素的容器。相反，它似乎被用作将单个bean显示为行的表。Vaadin确实有一个，但是我不认为它可以用来创建一个由其他UI元素组成的网格。
如何复制JavaFX的GridPan
浏览 5提问于2021-04-09得票数 2
回答已采纳
1回答
我不知道这是否可能，但实际上我看不出为什么不可以。我知道所有的事情都发生在我的Adapter getView函数中，但是我</em
浏览 2提问于2010-11-03得票数 0
回答已采纳
1回答
一大格的按钮
、、
用最少的代码建立一个8×8的按钮网格的最简单的方法是什么？我知道我可以用一张桌子，放64个单独的按钮，但对我来说，这似乎有点乏味。这个想法是有64个按钮，都是一个图标大小的图片。每个按钮都必须是独一无二的。我希望每个按钮o
浏览 0提问于2013-12-14得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
