源代码：
下载代码
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> <div class="relative rounded-xl overflow-auto p-8"><div class="grid grid-cols-2 gap-x-4 place-items-center"> <div class="flex flex-col items-start gap-y-4"> <p class="text-sm font-medium">Left-to-right</p> <div class="bg-indigo-500 rounded-lg shadow-lg overflow-hidden flex font-mono text-white text-sm font-bold leading-6"> <div class="w-8 bg-stripes-white"></div> <div class="p-4">ps-8</div> </div> <div class="mt-4 bg-indigo-500 rounded-lg shadow-lg overflow-hidden flex font-mono text-white text-sm font-bold leading-6"> <div class="p-4">pe-8</div> <div class="w-8 bg-stripes-white"></div> </div> </div> <div class="flex flex-col items-end gap-y-4"> <p class="text-sm font-medium">Right-to-left</p> <div class="bg-indigo-500 rounded-lg shadow-lg overflow-hidden flex font-mono text-white text-sm font-bold leading-6"> <div class="p-4">ps-8</div> <div class="w-8 bg-stripes-white"></div> </div> <div class="mt-4 bg-indigo-500 rounded-lg shadow-lg overflow-hidden flex font-mono text-white text-sm font-bold leading-6"> <div class="w-8 bg-stripes-white"></div> <div class="p-4">pe-8</div> </div> </div> </div> </div> </body> </html>
运行结果：
AI 编程工具