<!Doctype html> <head><https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css> <link rel="stylesheet" type="text/css" href="style.css"></head> <body> <div class="wrapper"> <div class="header"> <H2>主の独り言</H> <img src="ninja.jpg"> <p id="RealtimeClockArea">※ここに時計(2桁固定版)が表示されます。</p> <script type="text/javascript"> function set2fig(num) { // 桁数が1桁だったら先頭に0を加えて2桁に調整する var ret; if( num < 10 ) { ret = "0" + num; } else { ret = num; } return ret; } function showClock2() { var nowTime = new Date(); var nowHour = set2fig( nowTime.getHours() ); var nowMin = set2fig( nowTime.getMinutes() ); var nowSec = set2fig( nowTime.getSeconds() ); var msg = "現在時刻は、" + nowHour + ":" + nowMin + ":" + nowSec + " です。"; document.getElementById("RealtimeClockArea").innerHTML = msg; } setInterval('showClock2()',1000); </script> </div> <div class="container-fluid"> <div class="row"> <div class="col-sm-2" style="background-color:red;">Red</div> <div class="col-sm-8" style="background-color:blue;">Blue</div> <div class="col-sm-2" style="background-color:yellow;">Yellow</div> </div> </div> </div> </div> </body> </html>
下行の方のコードなのですが、
<div class="container-fluid"> 以降で、bootstrapのカラムを2,8,2で分けているのですが、 縦に並びます。 横に並べたいのですが、アドバイスお願いいたします。回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/02/23 05:57