2015-09-21 3 views
-1

Я пытаюсь показать кнопки внутри большой кнопки в HTML.Вложенные кнопки в HTML

Я не понимаю, почему четыре внутренних кнопки в моем HTML-коде отображаются вне родительской кнопки.

Что я здесь делаю неправильно?

<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Nested Buttons</title> 
    </script> 
</head> 
<body > 
<button style="height:750px; width:750px">Click here 
<button style="height:50px; width:50px">a</button> 
<button style="height:50px; width:50px">b</button> 
<button style="height:50px; width:50px">c</button> 
<button style="height:50px; width:50px">d</button> 
</button> 
</body> 
</html> 
+1

вы не должны добавить кнопку тег внутри другого тега кнопки. Это неправильный синтаксис –

+1

Но это работает в WPF ... –

+0

В некоторых случаях это может сработать, но это всего лишь недостаток программного обеспечения. Синтаксис - это то, о чем идет речь. Кнопка не должна содержать кнопок. Попробуйте использовать другие элементы. Может быть, холст? ;) (Я точно не знаю, что вы создаете, может быть, простой div будет стоять) –

ответ

1

Нельзя добавлять кнопку внутри другой кнопки. Это неправильный синтаксис.

Попробуйте использовать div вместо button.

<div style="height:750px; width:750px; border:1px solid black;">Click here 
<button style="height:50px; width:50px">a</button> 
<button style="height:50px; width:50px">b</button> 
<button style="height:50px; width:50px">c</button> 
<button style="height:50px; width:50px">d</button> 
</div> 

Demo Здесь: https://jsfiddle.net/swpm3aL1/3/

+0

Это не то, что я просил. Я хочу видеть 5 кнопок: одна большая кнопка и внутри нее 4 кнопки. –

+0

Возможно, вам нужно использовать поле, которое можно нажать, а не кнопку ... –

+0

Хорошо, как мне это сделать? –

Смежные вопросы