Bootstrap4:段組作成例2

下記の例では、最初にまず2段組があり、その右側の段の中にさらに4段組(やや狭い画面では2段組)があります。 とても狭い画面では、すべて段組なしになります。

メイン段

このメイン段の中で、さらに段組構造が作られています。このように、1つの段の中を、さらに複数の段組に分割することもできます。

Webフォント

500種類を超える豊富なアイコンをWebフォント機能で表示できるFont Awesomeの使い方を解説。画像ではなく独自のフォントを使った「文字」でアイコンが表示できる点が特長。CSSを使うことで簡単に望みのサイズや配色でアイコンを表示できます。

記事を読む »

スライドショー

複数の画像が数秒間隔でフェイドアウト・フェイドインを繰り返す「ふわっと表示が切り替わる」効果のあるスライドショーを作る方法を解説。jQueryを使ったスクリプト「A Simple jQuery Slideshow」を使うことで、とても短いJavaScriptソースで作成できます。

記事を読む »

Web作成ソフト

Microsoft製のホームページ作成ソフト「Microsoft Expression Web 4」が開発終了に伴って無料公開されています。ソースを編集したりWYSIWYG編集が可能。ソース補完機能、入力支援機能、文法チェック機能などを備えた、統合ホームページ作成ソフトです。

記事を読む »

アクセス制限

ウェブサイト内の特定のページやディレクトリにアクセス制限を施す方法として、基本認証(BASIC認証・ベーシック認証)の使い方を初心者向けに解説しました。ユーザー認証(IDとパスワードの入力)機能で閲覧制限が施された会員制ウェブページを作ってみましょう。

記事を読む »

段組のネスト構造の例:

▼2階層 = 2段組+右側の段をさらに3段組


A段
3/12


B段
9/12

B-1
4/12

B-2
4/12

B-3
4/12

▼3階層 = 2段組+右側の段をさらに3段組+中央をさらに3段組



A段
2/12



B段
10/12


B-1
3/12

B-2
6/12

B-2-1
4/12

B-2-2
4/12

B-2-3
4/12


B-3
3/12


解説記事に戻る