維基百科的HTML家族樹造型

-2

維基百科經常將家族樹結合到他們的文章中。一個例子可以在這裏找到：維基百科的HTML家族樹造型

https://en.wikipedia.org/wiki/Monarchy_of_Belgium#List_of_Kings_of_the_Belgians

如果我查看上述家譜的HTML源代碼，我看不出他們是如何保持空白表格單元格從圖紙邊界。

有人可以指向控制此家族樹中單元格樣式的樣式代碼嗎？我想重現一棵家譜，但簡單地切割並粘貼<table> </table>內容失敗。我得到的只是一個巨大的網格。

來源

2016-01-21 instrumentally

邊框在「td」元素上完成，而不在表格上 – epoch

但是在HTML源代碼中沒有任何內容可以控制單元格邊框的可見性標記。例如。 – instrumentally

使用谷歌瀏覽器（例如），而不是右鍵單擊並選擇「查看頁面源代碼」，選擇下一個選項「檢查」打開開發工具側邊欄。您將看到應用於每個元素的源代碼和樣式，包括來自樣式表的樣式表以及直接應用於標記的內聯樣式。

編輯：我已經提取您的標記和樣式爲jsFiddle你必須凝聚所有匹配的樣式每個「TD」成一個樣式聲明。

#TABLE_1 { 
    color: rgb(37, 37, 37); 
    height: 1651px; 
    width: 1211px; 
    perspective-origin: 605.5px 825.5px; 
    transform-origin: 605.5px 825.5px; 
    border-spacing: 0px 0px; 
    font: normal normal normal normal 14px/22.4px sans-serif; 
    outline: rgb(37, 37, 37) none 0px; 
}

等等等等

來源

2016-01-21 13:44:07

我按照你的建議完成了，並編譯了所有樣式的列表，但是，這隻會使表看起來比沒有任何的CSS代碼更糟糕： – instrumentally

jsFiddle CSS代碼只能用於該特定表（List_of_Kings_of_the_Belgians）。我僅以此爲例。而且，原始的Wiki HTML在其和標籤中沒有「id」元素。你正在做的是對原始HTML進行相當大的修改。我希望能夠從各種Wiki家族樹中「借用」HTML，而不必將任何新代碼插入任何「借用」單元中。 – instrumentally

是的，我使用添加ID的工具提取代碼作爲自己的內部參考 - 您必須做驢工作來移除ID並在輸出CSS中找出相似之處（在減少了相當多的例子之後）。通過玩這個減少的樣本，你會發現他們如何設計一些「td」，而不是其他人...... –

我終於想通了什麼問題了。在我的HTML源代碼中，我鏈接到了一個默認的CSS文件，我經常使用它來處理所有的HTML項目。原來，CSS中有代碼在每個單元格周圍畫黑線。

來源

2016-01-21 21:48:47 instrumentally

維基百科的HTML家族樹造型

回答

相關問題