teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

追記

2017/07/10 08:27

投稿

s8_chu
s8_chu

スコア14731

answer CHANGED
@@ -20,4 +20,129 @@
20
20
  </form>
21
21
  </body>
22
22
  </html>
23
+ ```
24
+ 追記
25
+ ---
26
+ いくつか文法的な誤りを修正して検証した結果、問題が再現しませんでした。以下のコードを実行してみてください。また、今回は修正していませんが、**center要素はHTML5で廃止された**ので、いつ使えなくなってもおかしくありません。**CSSで中央寄せをしましょう**。
27
+ ```HTML
28
+ <!DOCTYPE html>
29
+ <html lang="ja">
30
+ <head>
31
+ <meta charset="utf-8">
32
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
33
+ <meta name="viewport" content="width=device-width, initial-scale=1">
34
+ <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
35
+ <title>タイトル</title>
36
+ </head>
37
+ <body>
38
+ <center>
39
+ <ul id="menu">
40
+ <li><a href="#">トップ</a></li>
41
+ <li><a href="#">登録</a></li>
42
+ <li><a href="#">検索</a></li>
43
+ <li><a href="#">一覧</a></li>
44
+ </ul>
45
+ <form method="post" action="" class="form-horizontal">
46
+ <br>
47
+ <br>
48
+ <br>
49
+ <div class="form-group">
50
+ <label for="name" class="control-label col-sm-4">ID:</label>
51
+ <div class="col-sm-4">
52
+ <input type="text" name="id" class="form-control" required="required">
53
+ </div>
54
+ </div>
55
+
56
+ <div class="form-group">
57
+ <label for="name" class="control-label col-sm-4">なまえ:</label>
58
+ <div class="col-sm-4">
59
+ <input type="text" name="name" required="required" class="form-control">
60
+ </div>
61
+ <div class="col-sm-1">
62
+ <select name="sex" class="form-control">
63
+ <option value="♂">♂</option>
64
+ <option value="♀">♀</option>
65
+ <option value="なし">なし</option>
66
+ </select>
67
+ </div>
68
+ </div>
69
+
70
+ <div class="form-group">
71
+ <label for="name" class="control-label col-sm-4">とくせい:</label>
72
+ <div class="col-sm-4">
73
+ <input type="text" class="form-control" name="tokusei" required="required">
74
+ </div>
75
+ </div>
76
+
77
+ <div class="form-group">
78
+ <label for="name" class="control-label col-sm-4">タイプ:</label>
79
+ <div class="col-sm-2">
80
+
81
+ <table>
82
+ <tr>
83
+ <td>
84
+ <select class="form-control" name="type1" required>
85
+ <option value="">--</option>
86
+ </select>
87
+ </td>
88
+ <td>
89
+ <select class="form-control" name="type2">
90
+ <option value="">--</option>
91
+ </select>
92
+ </td>
93
+ </tr>
94
+ </table>
95
+ </div>
96
+ </div>
97
+ <h3>種族値</h3>
98
+ <input type="text" size="5" placeholder="HP" name="sHP_d">
99
+ <input type="text" size="5" placeholder="攻撃" name="sAtt_d">
100
+ <input type="text" size="5" placeholder="防御" name="sDef_d">
101
+ <input type="text" size="5" placeholder="特攻" name="sSatt_d">
102
+ <input type="text" size="5" placeholder="特防" name="sSdef_d">
103
+ <input type="text" size="5" placeholder="素早" name="sQui_d">
104
+ <br>
105
+
106
+ <h3>個体値</h3>
107
+ <input type="text" size="5" placeholder="HP" name="kHP_d">
108
+ <input type="text" size="5" placeholder="攻撃" name="kAtt_d">
109
+ <input type="text" size="5" placeholder="防御" name="kDef_d">
110
+ <input type="text" size="5" placeholder="特攻" name="kSatt_d">
111
+ <input type="text" size="5" placeholder="特防" name="kSdef_d">
112
+ <input type="text" size="5" placeholder="素早" name="kQui_d">
113
+ <br>
114
+ <h3>努力値</h3>
115
+ <input type="text" size="5" placeholder="HP" name="eHP_d">
116
+ <input type="text" size="5" placeholder="攻撃" name="eAtt_d">
117
+ <input type="text" size="5" placeholder="防御" name="eDef_d">
118
+ <input type="text" size="5" placeholder="特攻" name="eSatt_d">
119
+ <input type="text" size="5" placeholder="特防" name="eSdef_d">
120
+ <input type="text" size="5" placeholder="素早" name="eQui_d">
121
+ <br>
122
+ <div class="form-group">
123
+ <h3>わざ</h3>
124
+ <ul class="list-inline">
125
+ <li><input type="text" name="skill1" class="form-control"></li>
126
+ <li><input type="text" name="skill2" class="form-control"></li>
127
+ <li><input type="text" name="skill3" class="form-control"></li>
128
+ <li><input type="text" name="skill4" class="form-control"></li>
129
+ </ul><!-- ul要素の終了タグ -->
130
+ </div>
131
+
132
+ <div class="form-group">
133
+ <label for="name" class="control-label col-sm-4">メモ:</label>
134
+ <div class="col-sm-4">
135
+ <textarea name="memo" id="name" class="form-control" cols="3" rows="3"></textarea>
136
+ </div>
137
+ </div>
138
+
139
+ <br>
140
+ <input type="reset" class="button" value="リセット">
141
+ <input type="submit" class="button" value="送信">
142
+ </center>
143
+ </form>
144
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
145
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
146
+ </body>
147
+ </html>
23
148
  ```