https://www.pdawiki.com/forum/thread-40377-1-1.html
請賜教: html 在 image 的標簽如何劃格線 - 词库制作交流区 - Dictionary Compilation - 掌上百科 - PDAWIKI - Powered by Discuz!
懇請各位先進蒞臨指導，一個問題搞了一夜，搞不出來，html 在 image 的標簽, 若想把此 image 劃上格線左5格右5格等分的大小該如何處理，實在是找不到解決辦法
-
格線可貼附在 image 上…或許可用層的概念 z-index
-
目前碰到定位問題…且弄成 mdx 格線沒顯示…非常不解…
-
目前 格線的部份和 圖片竟是分離的…兩者並非一體…也就是放大縮小時格線會隨之放大縮小
不知可有辦法可以完全貼附格線和圖片一起放大縮小 -
img {position: absolute; left: 0px; top: 0px; z-index: -1;}…image 用 absolute 定位似乎也行不通…此會和之前的導航和翻頁有衝突…
且如此定位…圖似乎如同 background image …也無法擺於導航和翻頁之間
附圖如下…另一張為無導航和翻頁的 html 格線的顯示 -
令人更不解的是 為何 寬度可以用 百分比的比例但高度卻用不了百分比的比例 width: 50%; height: 500px;
高度若用 百分比的比例… …width: 50%; height: 20%; …… 顯示根本是錯誤的
Thanks a lot
<html>
<head>
<style>
table, td {
border: 3px solid blue;
border-collapse: collapse;
color:red;
width: 50%;
height: 500px;
z-index: 1;
text-align: right;
font-size: 3em;
opacity:0.5;
}
img {position: absolute;
left: 0px;
top: 0px;
z-index: -1;
}
</style>
</head>
<body>
<table style="width:100%">
<tr>
<td>1</td>
<td></td>
</tr>
<tr>
<td>2</td>
<td></td>
</tr>
<tr>
<td>3</td>
<td></td>
</tr>
<tr>
<td>4</td>
<td></td>
</tr>
<tr>
<td>5</td>
<td></td>
</tr>
</table>
<img src="C:\cpdic\css\OECD_25.png" width="100%"></img>
</body>
</html>
https://c-t.work/s/fbe2adefc2e146 或进入 cowtransfer.com 获取，在首页输入取件码：4wagja（24小时内有效）
