菜鸟教程在线编辑器

AI 编程工具
 
                <!doctype html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-100 p-6">

<!-- 边框宽度和颜色 -->
<div class="border-4 border-red-500 p-4 mb-6">
    4px 宽的红色边框
</div>

<!-- 边框样式 -->
<div class="border-2 border-dashed border-blue-500 p-4 mb-6">
    蓝色虚线边框，宽度为 2px
</div>

<!-- 边框圆角 -->
<div class="border-4 border-green-500 rounded-lg p-6 mb-6">
    圆角绿色边框
</div>

<!-- 边框方向控制 -->
<div class="border-t-4 border-r-2 border-b-1 border-l-3 border-yellow-500 p-4">
    自定义方向的边框
</div>

</body>
</html>
              