BlueGriffon でサイドバーを作成する 方法を紹介します。
ホームページのレイアウト
今回は コンテンツ サイドバー の作成です。

<div>へ名前を付け、スタイルシートを指定します。
<div>へCSS(スタイルシート)を指定するには、id属性を使います。
<div> を選択した状態で → を押します。

エンター ⏎ を押します。

<div> をクリックします。

<div>を選択し「スタイル プロパティ」「この要素のみ(ID 指定)」をクリックします。

コンテンツの 位置とレイアウト
コンテンツを左にフロートし「Please enter an ID」に「contents」と入力して ok をクリックします。

float
縦に並んでいた要素を横並びにすることが出来ます。
<div id=”contents”>の中にh2を入れます。

h2 のスタイルシート
<h2>を選択します。

要素名で指定する を選択し 文字の大きさ・揃え を指定します。

色を指定します。

サイドバーの 位置とレイアウト
<h2> を選択した状態で → を押します。

エンター ⏎ を押します。

サイドバーを右にフロートし「Please enter an ID」に「menu」と入力して ok をクリックします。

float
縦に並んでいた要素を横並びにすることが出来ます。
サイドバーの枠線を指定
枠線の「種類・太さ・色」を指定します。

大きさを指定します。

サイドバーに番号付きリストを挿入します。

サイドバーの 文字の大きさ 太さを指定します。

サイドバーの文字に色を指定します。

サイドバーまで出来上がりました。

コメント