3月13日(授業日)

○paiza

新規問題:文字の並べ替え

今回は月/日/年と表示するものであるから、与えらた各数字を$yearと$monthと$dayに代入して、$format ="$year,$day,$yearとして表示する形を作る。

出力するには$文字列=sprintf()[spritf関数は第一引数に生成する文字列のフォーマットを指定し、第二引数〜より生成する文字列や値を指定する]にして出力

 

○html

・bootstrapの利用に関して※使用するバージョン確認

<head>に下記のコードを記述

bootstrap.min.css"
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk"
crossorigin="anonymous">

</body>前に下記JSコード記述

integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
crossorigin="anonymous"></script>
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
crossorigin="anonymous"></script>

以上を記述しbootstrap利用可。

 

・まず本番(見本サイト)を参考にしてimgの間隔、文字の色、など細かいところまで

詳細に同じように模写する。

 

ロゴの配置〜nav barの作り方

<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">
</a> <ーーここにロゴの配置をすることで左上に配置ーー>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
 <ーー画面幅が狭くなった時navバーがハンバーガーに収まるように記述されているーー>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Lunch Desert</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Menu</a>

 

他bootstrapサイトをよく読むことがHP作成の効率化につながるとのこと!

こうなのかなと試す前にきちんと読む!!