CSS3

bootstrap

Bootstrap

Bootstrapでtext-left、text-center、text-rightを使って左寄せ・中央・右寄せを行う方法

2019/8/30    

Bootstrapではキストの左寄せ・中央・右寄せにするクラスが用意されています。 実際にはtext-left、text-center、text-rightクラスを指定することで実現します。 左寄せ ...

bootstrap

Bootstrap

Boostrapクラス一覧

2019/8/30    

Boostrapに定義されているクラスを自分メモ用にまとめておきます。 随時追加していきます。 メディアクエリーブレークポイント(BreakPoint)の指定 Bootstrapでの画面サイズによるメ ...

bootstrap

Bootstrap

Boostrapでマージン(margin)とパディング(Paddning)を指定する方法

2019/8/30    

Boostrapでのマージン(margin)とパディング(Paddning)の指定は既定のクラスが設定されているので、そのクラスを利用するとマージン(margin)とパディング(Paddning)が設 ...

bootstrap

Bootstrap

Boostrapで横幅と高さを指定する方法

2019/8/30    

Boostrapでの横幅と高さの指定は既定のクラスが設定されているので、そのクラスを利用すると簡単に横幅と高さが設定できます。 Boostrapでの横幅と高さの指定 Boostrapでは横幅(widt ...

bootstrap

Bootstrap

Bootstrap4のグリッドシステムおさらい

2019/8/29    

Bootstrap4では画面の横幅を12分割して管理する「グリッドシステム」を採用しています。 この「グリッドシステム」を利用すれば、簡単にスマホなどに対応したレスポンシブデザインの表を作成することが ...

bootstrap

Bootstrap

Bootstrapでd-flexを使って上寄せ・上下中央・下寄せを行う方法

2019/8/30    

Bootstrapではflexboxを利用することでテキストをコンテナの上寄せ・上下中央・下寄せにすることができます。 実際にはd-flexクラスとalign-items-start,align-it ...

プログラミング

CSS

CSSで画像に文字を重ねて表示する方法

2019/3/19    

CSS(スタイルシート)ではpositionプロパティにrelativeとabsoluteを組み合わせることで自由にHTMLの要素や画像を重ねて表示することができます。 今回は画像の上に文字を重ねて表 ...

プログラミング

CSS

CSSの基本「ボックスモデル」をCSSで書いてみる

2019/3/18    

CSS(スタイルシート)を学ぶ上で必ず理解しないと行けないものの一つに「ボックスモデル」があります。 巷ではボックスモデルの図が良く出てますが、この記事ではボックスモデル自体をCSS(スタイルシート) ...

bootstrap

Bootstrap

Bootstrapで画像を丸く表示するrounded-circleの使い方

2018/11/13    ,

Bootstrapで画像を丸く表示する Bootstrapで画像を丸く表示するにはrounded-circleを使います。 Bootstrap4では四角い画像を簡単に丸い形で表示することができます。 ...

Copyright© ソフトウェア開発日記 , 2019 All Rights Reserved.