teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問CssのFloatについて

編集履歴

質問編集履歴

8

2019/03/24 13:52

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -126,4 +126,7 @@
126
126
  margin-left:15px;
127
127
  }
128
128
 
129
+ }
130
+
131
+
129
132
  ```

7

2019/03/24 13:52

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -22,24 +22,23 @@
22
22
  <div class="yousoichihonnbunn">
23
23
  <p>要素１本文</p>
24
24
  </div>
25
- </div>
25
+ </div>
26
- <div class="hutatume">
26
+ <div class="hutatume">
27
27
  <div class="yousoni">
28
28
  <h2>要素２</h2>
29
29
  </div>
30
30
  <div class="yousonihonnbunn">
31
31
  <p> 要素２本文</p>
32
32
  </div>
33
- </div>
33
+ </div>
34
- <div class="mittume">
34
+ <div class="mittume">
35
35
  <div class="yousosann">
36
36
  <h2>要素３</h2>
37
37
  </div>
38
38
  <div class="yousosannhonnbunn">
39
39
  <p>要素３本文</p>
40
40
  </div>
41
- </div>
41
+ </div>
42
- </div>
43
42
 
44
43
  ```
45
44
 

6

2019/03/24 13:50

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
File without changes

5

2019/03/24 12:27

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -1,5 +1,4 @@
1
- コード
2
- ```### css Floatについて
1
+ css Floatについて
3
2
 
4
3
  htmlとcssを使ってホームページを作っています。
5
4
 

4

2019/03/24 12:26

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -1,4 +1,5 @@
1
+ コード
1
- ### css Floatについて
2
+ ```### css Floatについて
2
3
 
3
4
  htmlとcssを使ってホームページを作っています。
4
5
 
@@ -14,7 +15,7 @@
14
15
 
15
16
 
16
17
  htmlのコード
17
- '''
18
+ ```
18
19
  <div class="hitotume">
19
20
  <div class="yousoichi">
20
21
  <h2>要素１</h2>
@@ -41,13 +42,13 @@
41
42
  </div>
42
43
  </div>
43
44
 
44
- '''
45
+ ```
45
46
 
46
47
 
47
48
 
48
49
  cssのコード
49
50
 
50
- '''
51
+ ```
51
52
 
52
53
  @media screen and (min-width:961px) {
53
54
 
@@ -127,4 +128,4 @@
127
128
  margin-left:15px;
128
129
  }
129
130
 
130
- '''
131
+ ```

3

コードの訂正です。

2019/03/24 12:25

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -14,7 +14,8 @@
14
14
 
15
15
 
16
16
  htmlのコード
17
+ '''
17
- '''<div class="hitotume">
18
+ <div class="hitotume">
18
19
  <div class="yousoichi">
19
20
  <h2>要素１</h2>
20
21
  </div>
@@ -39,6 +40,7 @@
39
40
  </div>
40
41
  </div>
41
42
  </div>
43
+
42
44
  '''
43
45
 
44
46
 
@@ -46,6 +48,7 @@
46
48
  cssのコード
47
49
 
48
50
  '''
51
+
49
52
  @media screen and (min-width:961px) {
50
53
 
51
54
  .yousoichi{
@@ -123,4 +126,5 @@
123
126
  margin-right:15px;
124
127
  margin-left:15px;
125
128
  }
129
+
126
130
  '''

2

質問文のコードに'''を加えました。よろしくお願いします

2019/03/24 12:17

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -14,7 +14,7 @@
14
14
 
15
15
 
16
16
  htmlのコード
17
- <div class="hitotume">
17
+ '''<div class="hitotume">
18
18
  <div class="yousoichi">
19
19
  <h2>要素１</h2>
20
20
  </div>
@@ -39,12 +39,13 @@
39
39
  </div>
40
40
  </div>
41
41
  </div>
42
+ '''
42
43
 
43
44
 
44
45
 
45
-
46
46
  cssのコード
47
47
 
48
+ '''
48
49
  @media screen and (min-width:961px) {
49
50
 
50
51
  .yousoichi{
@@ -121,4 +122,5 @@
121
122
  margin-bottom:15px;
122
123
  margin-right:15px;
123
124
  margin-left:15px;
124
- }
125
+ }
126
+ '''

1

実際に書いてみたコードを追加させていただきました

2019/03/24 12:15

投稿

aness-i-rinupen
aness-i-rinupen

スコア13

title CHANGED
File without changes
body CHANGED
@@ -8,4 +8,117 @@
8
8
 
9
9
  長文失礼します
10
10
  本当の初心者ですいません
11
- よろしくお願いします
11
+ よろしくお願いします
12
+
13
+
14
+
15
+
16
+ htmlのコード
17
+ <div class="hitotume">
18
+ <div class="yousoichi">
19
+ <h2>要素１</h2>
20
+ </div>
21
+ <div class="yousoichihonnbunn">
22
+ <p>要素１本文</p>
23
+ </div>
24
+ </div>
25
+ <div class="hutatume">
26
+ <div class="yousoni">
27
+ <h2>要素２</h2>
28
+ </div>
29
+ <div class="yousonihonnbunn">
30
+ <p> 要素２本文</p>
31
+ </div>
32
+ </div>
33
+ <div class="mittume">
34
+ <div class="yousosann">
35
+ <h2>要素３</h2>
36
+ </div>
37
+ <div class="yousosannhonnbunn">
38
+ <p>要素３本文</p>
39
+ </div>
40
+ </div>
41
+ </div>
42
+
43
+
44
+
45
+
46
+ cssのコード
47
+
48
+ @media screen and (min-width:961px) {
49
+
50
+ .yousoichi{
51
+ font-size:24px;
52
+ background-color:#6E2A40;
53
+ box-shadow: 0px 0px 0px 5px #6E2A40;
54
+ border:dashed 2px white;
55
+ padding:3px 15px;
56
+ margin-right:20px;
57
+ margin-left:20px;
58
+ }
59
+
60
+ .yousoichi h2{
61
+ color:white;
62
+ }
63
+
64
+ .yousoichihonnbunn{
65
+ font-size:16px;
66
+ border-right:2px solid #808080;
67
+ border-left:2px solid #808080;
68
+ border-bottom:2px solid #808080;
69
+ padding:5px 10px 10px 10px;
70
+ margin-bottom:15px;
71
+ margin-right:15px;
72
+ margin-left:15px;
73
+ }
74
+
75
+ .yousoni{
76
+ font-size:24px;
77
+ background-color:#6E2A40;
78
+ box-shadow: 0px 0px 0px 5px #6E2A40;
79
+ border:2px dashed white;
80
+ padding:3px 15px;
81
+ margin-right:20px;
82
+ margin-left:20px;
83
+ }
84
+
85
+ .yousoni h2{
86
+ color:white;
87
+ }
88
+
89
+ .yousonihonnbunn{
90
+ font-size:16px;
91
+ border-right:2px solid #808080;
92
+ border-left:2px solid #808080;
93
+ border-bottom:2px solid #808080;
94
+ padding:5px 10px 10px 10px;
95
+ margin-bottom:15px;
96
+ margin-right:15px;
97
+ margin-left:15px;
98
+ }
99
+
100
+
101
+ .yousosann{
102
+ font-size:24px;
103
+ background-color:#6E2A40;
104
+ box-shadow: 0px 0px 0px 5px #6E2A40;
105
+ border:2px dashed white;
106
+ padding:3px 15px;
107
+ margin-right:20px;
108
+ margin-left:20px;
109
+ }
110
+
111
+ .yousosann h2{
112
+ color:white;
113
+ }
114
+
115
+ .yousosannhonnbunn{
116
+ font-size:16px;
117
+ border-right:2px solid #808080;
118
+ border-left:2px solid #808080;
119
+ border-bottom:2px solid #808080;
120
+ padding:5px 10px 10px 10px;
121
+ margin-bottom:15px;
122
+ margin-right:15px;
123
+ margin-left:15px;
124
+ }