我并不是一名真正的前端设计师,但有一些在一个小网站上工作的代码.

当我试图在Blazor中使用相同的代码/样式时,它并不真正起作用.

我的目标是在表格中的行上方(和下方)有一条像素线.

enter image description here

我使用的图像高度为1像素,在我的普通网站中,这使得该单元格和行的高度也为1像素.:

    <table border="0" cellspacing="0" cellpadding="0">
      <tr><td><img src="bar.gif" width="100%" height="1" alt=""></td></tr>

   ....

我似乎在Blazor无法实现这个目标.

enter image description here

我不明白为什么.

我try 了一些更多的风格:

border-collapse:collapse;

<tr style="height:3px !important;">

余量="0"填充="0"(在TR / TD和IMG中).

一切都无济于事.

有人知道为什么这个效果不好吗?

推荐答案

Blazor默认包含Bootstrap,这意味着您已经有了一些table、tra和td的样式.

您可以从"Blazor服务器应用程序空"(dotnet = 7)开始

这里的快速修复方法是围绕IMG元素的<td style="line-height:1px">个,尽管我更喜欢css类而不是内联样式.

Html相关问答推荐

springBoot + Thymeleaf:基于Locale设置页面语言

如何使div按钮链接到另一个网页

如何使用css实现悬停时的动画zoom ?

将弹性容器设置为内容宽度

IFRAME中的Chrome图像未调整大小

禁用的文本区域会丢失换行符

元素offsetTop在滚动容器中时没有更改

如何在小屏幕中制作水平滚动div

(HTML框架标签)点击后目标框架将不再工作

在 laravel 中使用 DomPDF 将数据导出为 pdf 时,第二列被拉伸

带圆角帽的 CSS 部分边框

CSS flex:0 0 auto创建了1像素的间隙

使用HTML和CSS构建简历网站.无法使body元素内的div元素跨越整个网站高度

如何正确地嵌套Flexbox

Angular:从服务器下载 HTML 并打印

用于表行组标题的正确 HTML 标记是什么?

在shiny 的应用程序中使用图标功能时出错

使用模板循环每行列出 3 个 bootstrap 卡

如何向上移动图像并溢出图像的一部分而另一部分不溢出

SVG 适用于 Safari,不适用于 Chrome