#html #css
#HTML #css
Вопрос:
Я пытаюсь создать overlaywindow с помощью html.
но я не могу создать элемент в элементе HTML, таком как таблица.
Я пытался использовать синтаксис полей, но он не работает
, результат отображается следующим
образом: в левой части элемента html есть таблица
HTML элемент:
var h3 = document.createElement('h3')
var infoTitle = document.createTextNode('열수송관정보')
h3.appendChild(infoTitle)
cwContent.appendChild(h3)
var cwTable = document.createElement('table')
cwTable.className = 'infoTable'
row = cwTable.insertRow(0)
column = row.insertCell(0)
column.innerHTML = '시공일자'
column = row.insertCell(1)
column.innerHTML = '2020-10-29'
row = cwTable.insertRow(1)
column = row.insertCell(0)
column.innerHTML = '매설지역'
column = row.insertCell(1)
column.innerHTML = '성동구'
row = cwTable.insertRow(2)
column = row.insertCell(0)
column.innerHTML = '등급'
column = row.insertCell(1)
column.innerHTML = 'A'
row = cwTable.insertRow(3)
column = row.insertCell(0)
column.innerHTML = '길이'
column = row.insertCell(1)
column.innerHTML = '50m'
row = cwTable.insertRow(4)
column = row.insertCell(0)
column.innerHTML = '직경'
column = row.insertCell(1)
column.innerHTML = '40A'
cwContent.appendChild(cwTable)
Стиль:
<style lang="scss">
.overlayBox {
border-radius: 5px;
text-align: center;
border: 1px solid #333333;
.infoTable .infoManholeTable .infoPipeStatusTable .infoPipeStatusTable {
text-align: center;
width: 100%;
border: 1px solid #333333;
border-collapse: collapse;
}
td {
border: 1px solid #333333;
border-collapse: collapse;
}
}
</style>
Комментарии:
1. Я не совсем уверен, о чем вы спрашиваете, но вы можете использовать CSS Psuedo Elements для создания контента с помощью CSS w3schools.com/CSS/css_pseudo_elements.asp
2. вам нужны заголовки таблицы рядом? похожие jsfiddle.net/jhdkotLx/2 ?