使用 CSS 的图像网格
在本文中，我们将看到如何使用 HTML 和 CSS 创建钻石网格。我们将使用位置属性以网格形式对齐图像。
-
HTML 部分代码:在本节中，我们将创建一个网格结构。
进场:
- 使用“ul”创建一个有序列表，并添加一个类容器。
- 用类名创建六个“li”标记。
- 包括一个带有类名 bg 的“div”标签。
超文本标记语言
html <!DOCTYPE html> <html> <body> <!-- container for holding all images --> <ul class="container"> <!-- all li for items --> <li class="item1"> <div class="bg"></div> </li> <li class="item2"> <div class="bg"></div> </li> <li class="item3"> <div class="bg"></div> </li> <li class="item4"> <div class="bg"></div> </li> <li class="item5"> <div class="bg"></div> </li> </ul> </body> </html>
版权属于：月萌API www.moonapi.com，转载请注明出处
