如何解决在Tailwind CSS中用文字圈一下
我是初学者Web开发人员。 我在Tailwind CSS方面有小问题。我需要这个:https://ibb.co/KL8cDR2
这是我的代码:
<div class="w-1/2 h-10 rounded-full bg-gray-400" style="background-color:red">404</div>
但是它不起作用:(我该怎么做? 请帮助我
解决方法
<div class="font-bold text-gray-700 rounded-full bg-white flex items-center justify-center font-mono" style="height: 500px; width: 500px; font-size: 170px;">404</div>
这应该可以完成工作。确保添加一个定义圆的高度和宽度以及字体大小的自定义类,并从类中删除font-mono
并添加所需的字体。
位置绝对方式:
<div class="rounded-full border-2 flex p-3 relative">
<div class="absolute top-5 left-8">
4
</div>
</div>
在 tailwind.config.js 中扩展插入
theme: {
inset: {
'5': '5px','8': '8px'
}
}
弹性方式:
<div class="w-20 h-20 rounded-full flex justify-center items-center">
<p>404</p>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。