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

質問編集履歴

1

a

2021/12/16 03:08

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -1,51 +1,1 @@
1
- ### 前提・実現したいこと
2
- htmlで、入力フォームに値を入力し「ドルから円」や「円からドル」ボタンを押すと、値をドルや円に変換して表示するプログラムを作成しています。cssで全体を枠で囲うために、<form>タグを<div>タグで囲んだところ、結果が表示されなくなってしまいました。<div>タグがなければ枠は消えますが結果は表示されます。枠と結果の両方を表示できる方法を教えてください。
3
-
4
-
5
-
6
- ### 該当のソースコード
7
-
8
- ```html
1
+ 解決しました
9
- <div id="exchange">
10
- <form name="exchange" method="post">
11
- <table>
12
- <tr>
13
- <td>値を入力</td>
14
- <td><input type="number" name="money"></td>
15
- </tr>
16
- <tr>
17
- <td><input type="button" value="ドルから円" onClick="toYen()"></td>
18
- <td><input type="button" value="円からドル" onClick="toDollar()"></td>
19
- </tr>
20
- <tr>
21
- <td>結果</td>
22
- <td><output name="result"></output></td>
23
- </tr>
24
- </table>
25
- </form>
26
- </div>
27
-
28
- <script>
29
- function toYen(){
30
- var a = exchange.money.value;
31
- exchange.result.value = a*108.1;
32
- }
33
- function toDollar(){
34
- var a = exchange.money.value;
35
- exchange.result.value = a*0.0092;
36
- }
37
- </script>
38
-
39
- <!--以下css-->
40
- #exchange form{
41
- padding: 0 1.5em;
42
- margin: 0 0;
43
- background-color:#fcd8d8;
44
- border: dashed 2px #fd84a9;
45
- color:#000000;
46
- }
47
- ```
48
-
49
- ![![イメージ説明](e524c09b7fa6ae51f6d1e0de94fa6db3.png)]
50
-
51
- ![イメージ説明](8f8862146cf40d7eac26fc9ed07fa71a.png)