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

回答編集履歴

1

list-groupの書き方を追記

2017/09/13 07:44

投稿

motuo
motuo

スコア3027

answer CHANGED
@@ -32,4 +32,49 @@
32
32
 
33
33
  > 小さく
34
34
 
35
- ![イメージ説明](6482dcfd28a0695fe07285fa9e300880.png)
35
+ ![イメージ説明](6482dcfd28a0695fe07285fa9e300880.png)
36
+
37
+ > list-groupの書き方
38
+ ```HTML
39
+ <!DOCTYPE html>
40
+ <html>
41
+ <head>
42
+ <title>bootstrapTest</title>
43
+ <meta charset="UTF-8">
44
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
45
+ <link href="css/bootstrap.min.css" rel="stylesheet">
46
+ <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
47
+ <script src="js/bootstrap.min.js"></script>
48
+ </head>
49
+ <body>
50
+ <div class="container">
51
+ <div class="form-group">
52
+ <div class="row">
53
+ <ul class="list-group">
54
+ <li class="list-group-item-success">2017年05月10日
55
+ <ul class="list-group">
56
+ <li class ="list-group-item">
57
+ <div class="pull-left">hogehoge</div>
58
+ <div class="text-right">1,000円</div>
59
+ </li>
60
+ </ul>
61
+ </li>
62
+ <li class="list-group-item-danger">2016年09月30日
63
+ <ul class="list-group">
64
+ <li class="list-group-item">
65
+ <div class="pull-left">fugafuga</div>
66
+ <div class="text-right">10,000円</div>
67
+ </li>
68
+ </ul>
69
+ </li>
70
+ </ul>
71
+ </div>
72
+ </div>
73
+ </div>
74
+ </body>
75
+ </html>
76
+ ```
77
+
78
+ > 表示イメージ
79
+
80
+ ![イメージ説明](53e14c5f8e2d225f0c95539c93934db9.png)