gpt4 book ai didi

html - 浏览器修改我的 HTML,导致输出不正确

转载 作者:太空宇宙 更新时间:2023-11-04 08:44:56 25 4
gpt4 key购买 nike

我制作了一些 HTML 来模拟我开发的软件的所需输出。我已确认(尽我所能)该文件的格式正确,但是当我在 Chrome 或 IE 中打开它时(也可能在其他浏览器中出现),浏览器更改了我提供的 HTML,给出了错误的输出。

我创建的 HTML 是:

<!DOCTYPE html>
<html>
<head>
<style>
*{margin:0;padding:0;vertical-align:top;text-align:left}
table{border-collapse:collapse;}
</style>
</head>
<body>
<table style="margin-left:15pt">
<tr>
<table>
<tr>
<td style="width:315.43pt"/>
<td style="text-align:right;width:118.93pt;height:12pt;font-family:arial;font-size:10pt">
Thursday, May 04, 2017
</td>
</tr>
</table>
</tr>
<tr>
<table>
<tr>
<td style="height:14.26pt"/>
</tr>
</table>
</tr>
<tr>
<table>
<tr>
<td style="width:72.21pt;height=12pt;font-family:arial;font-size:10pt">
Dear Someone,
</td>
</tr>
</table>
</tr>
<tr>
<table>
<tr>
<td style="height:21.95pt"/>
</tr>
</table>
</tr>
<tr>
<table>
<tr>
<td>
<table>
<tr>
<td style="height:86.52pt;width:231.89pt;border-style:solid;border-width:1pt;border-color:lightsteelblue;font-family:arial;font-size:10pt">
This text represents the contents of the email.
<br/>
<br/>
Blah Blah
<br/>
<br/>
Bibble.
<br/>
<br/>
Note how the line breaks get stripped from the text!
</td>
</tr>
</table>
</td>
<td style="width:5.24pt"/>
<td style="vertical-align:top">
<table>
<tr>
<td style="height:100.07pt;width:304.79pt;border-style:solid;border-width:1pt;border-color:lightsteelblue;font-family:arial;font-size:10pt;">
This text represents the contents of the emai.
<br/>
<br/>
Blah Blah
<br/>
<br/>
Bibble.
<br/>
<br/>
HTML format Text Boxes nearly get the formatting right (the Viewer is missing multiple breaks)!
</td>
</tr>
</table>
</td>
</tr>
</table>
</tr>
<tr>
<table>
<tr>
<td style="height:43.7pt"/>
</tr>
</table>
</tr>
<tr>
<table>
<tr>
<td style="width:0.06pt"/>
<td style="height:12pt;width:190.75pt;font-family:arial;font-size:10pt">
This image could be the signature:
</td>
<td style="width:77.95pt"/>
<td style="height:12pt;width:190.75pt;font-family:arial;font-size:10pt">
This image is from the internet
</td>
</tr>
</table>
</tr>
</table>
</body>
</html>

但是当我在 chrome 中打开它并查看源代码时,我得到:

<!DOCTYPE html>
<html><head>
<style>
*{margin:0;padding:0;vertical-align:top;text-align:left}
table{border-collapse:collapse;}
</style>
</head>
<body>
<table style="border-collapse:separate;">
<tbody><tr>
</tr></tbody></table><table>
<tbody><tr>
<td style="width:315.43pt">
</td><td style="text-align:right;width:118.93pt;height:12pt;font-family:arial;font-size:10pt">
Thursday, May 04, 2017
</td>
</tr>
</tbody></table>


<table>
<tbody><tr>
<td style="height:14.26pt">
</td></tr>
</tbody></table>


<table>
<tbody><tr>
<td style="width:72.21pt;height=12pt;font-family:arial;font-size:10pt">
Dear Someone,
</td>
</tr>
</tbody></table>


<table>
<tbody><tr>
<td style="height:21.95pt">
</td></tr>
</tbody></table>


<table>
<tbody><tr>
<td>
<table>
<tbody><tr>
<td style="height:86.52pt;width:231.89pt;border-style:solid;border-width:1pt;border-color:lightsteelblue;font-family:arial;font-size:10pt">
This text represents the contents of the email.
<br>
<br>
Blah Blah
<br>
<br>
Bibble.
<br>
<br>
Note how the line breaks get stripped from the text!
</td>
</tr>
</tbody></table>
</td>
<td style="width:5.24pt">
</td><td style="vertical-align:top">
<table>
<tbody><tr>
<td style="height:100.07pt;width:304.79pt;border-style:solid;border-width:1pt;border-color:lightsteelblue;font-family:arial;font-size:10pt;">
This text represents the contents of the emai.
<br>
<br>
Blah Blah
<br>
<br>
Bibble.
<br>
<br>
HTML format Text Boxes nearly get the formatting right (the Viewer is missing multiple breaks)!
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>


<table>
<tbody><tr>
<td style="height:43.7pt">
</td></tr>
</tbody></table>


<table>
<tbody><tr>
<td style="width:0.06pt">
</td><td style="height:12pt;width:190.75pt;font-family:arial;font-size:10pt">
This image could be the signature:
</td>
<td style="width:77.95pt">
</td><td style="height:12pt;width:190.75pt;font-family:arial;font-size:10pt">
This image is from the internet
</td>
</tr>
</tbody></table>



</body></html>

我知道输出是很多嵌套表格,但我正在尝试采用类似于 word 文件的不确定输入,并将其正确呈现为可通过电子邮件发送和显示的 HTML。我只是想知道为什么浏览器会像这样更改 html,如何阻止它这样做,如果我能够用我的 html 发送电子邮件,浏览器在通过网络邮件查看时是否仍会修改输出?

最佳答案

浏览器在解析 HTML 时修改它,因为它正在执行错误恢复。

你有很多错误 a validator会接起来。

最主要的是一个表格行元素<tr>只能有表格数据单元格 <td>和表格标题单元格 <td>作为它的 child 。你不能在那里放另一张 table 。

您可以将表格放在数据单元格中,但这几乎没有语义意义。

关于html - 浏览器修改我的 HTML,导致输出不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43844689/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com