在不移動其他表格元素的情況下更改邊框寬度

我有一個按鈕表格，單擊時它們的邊框寬度從1px增加到3px。我看過Javascript - Changing border-width without moving surrounding elements.,Don't affect positioning of other elements on border-width changes和How to add padding or border to a DIV and keep width and height?但這些都沒有幫助。我也嘗試了框大小和輪廓屬性，都沒有工作。我有此Javascript：表在不移動其他表格元素的情況下更改邊框寬度

function cur(curval) { 
    if (!prevElement) { 
     prevElement = document.getElementById(curval); 
     currentElement = prevElement; 
    } else { 
     prevElement = currentElement; 
     prevElement.style.borderWidth = "1px" 
     currentElement = document.getElementById(curval); 
    } 
    currentElement.style.borderWidth = "3px" 
    document.body.style.cursor = curval; 
}

下面是部分：

<tr> 
    <td><button id="default" onclick="cur('default')"><img 
    src="default.png"/></button></td> 
    <td><button id="alias" onclick="cur('alias')"><img src="alais.png"/> 
    </button></td> 
    <td><button id="cell" onclick="cur('cell')"><img src="cell.png"/> 
    </button></td> 
    <td><button id="col-resize" onclick="cur('col-resize')"><img src="col- 
    resize.png"/></button></td> 
    <td><button id="copy" onclick="cur('copy')"><img src="copy.png"/> 
    </button></td> 
    <td><button id="crosshair" onclick="cur('crosshair')"><img 
    src="crosshairs.png"/></button></td> 
</tr>

所有的按鍵都border: 1px solid black他們點擊，直到。我怎麼能做到這一點，邊界寬度不會影響表中的其他元素？

來源

2017-06-12 Henry

請同時顯示相關的HTML。 –

HTML請???? –

向表格單元格添加填充值，該值等於邊框大小的差值。

因此，如果最大的邊框寬度將是3px，當未選擇按鈕，你的表格單元格應該有2px填充，並且您的按鈕應該有1px邊框。當選擇按鈕時，表格單元格應該有一個填充值0，並且按鈕的邊框應該是3px。

以這種方式，選擇一個按鈕時不會發生可見的變化。

來源

2017-06-12 18:55:11 StephenRios

在不移動其他表格元素的情況下更改邊框寬度

回答

相關問題