我发现这个代码创建组框:
<fieldset> <legend>Title</legend> </fieldset>
据说它在运行时创建了以下分组框:
当我在我的Visual Studio代码中运行时,它显示如下:
边框几乎看不见,文本出现在错误的地方,我做错了什么吗?
u1ehiz5o1#
问题是所有的浏览器都有不同的默认样式,你的不一样。我从MacOS + Chrome109复制了一些用户代理样式表
fieldset { display: block; margin-inline-start: 2px; margin-inline-end: 2px; padding-block-start: 0.35em; padding-inline-start: 0.75em; padding-inline-end: 0.75em; padding-block-end: 0.625em; min-inline-size: min-content; border-width: 2px; border-style: groove; border-color: rgb(192, 192, 192); border-image: initial; } legend { display: block; padding-inline-start: 2px; padding-inline-end: 2px; border-width: initial; border-style: none; border-color: initial; border-image: initial; }
r8xiu3jd2#
尝试将CSS添加到元素:
border: 5px solid black;
示例:
<fieldset style="border: 5px solid black;"> <legend>Title</legend> </fieldset>
2条答案
按热度按时间u1ehiz5o1#
问题是所有的浏览器都有不同的默认样式,你的不一样。
我从MacOS + Chrome109复制了一些用户代理样式表
r8xiu3jd2#
尝试将CSS添加到元素:
示例: