- 2018年2月18日
- 2018年2月18日
超簡単！CSSで引き算をして横幅【width】を指定する方法・ファンクション”calc”
例えば100%のボックス要素の中に、50pxの要素 と 100% – 50pxの要素を並べる場合 このような場合、cssの数値で引き算が出来るとベスト。 calcという便利なファンクションがありますので、calcで計算式をすることが可能。 […]
TAG
CSS3
- 2017年9月20日
- 2017年9月20日
CSSで矢印の”＞”アイコンを作る方法
最近良く見かける'＞'での見出しやリストの項目があります。 これをテキストで打ってしまうと ＞ ここにリンクのテキスト といったように、不格好になってしまいます。 このようになっているとかっこいいですね。 html <a href="#" cl […]
- 2017年9月20日
- 2018年2月18日
cssのbox-sizingを利用して、余白やborderを内側にしてレイアウトをしやすくする。
box-sizingを使用することで、要素のサイズ（width）を明確にすることができます。 box-sizingを使用しない場合 たとえばbox-sizingを使用しない場合で、40%と60%のbox要素にpadding 20pxをかけると このよ […]
- 2016年11月3日
- 2018年2月18日
要素が画面に入ったらアニメーションをするパララックス【inview.js】と【animeite.css】の使い方
最近ではLPのみならず、通常の企業サイトでもアニメーションを使用して要素を出現させたり動かしたりするサイトが増えてきました。 その中でも最も使いやすく動作が軽いjQueryのプラグイン【inview.js】と、cssのアニメーションプラグイン【Ani […]
- 2016年7月24日
- 2018年2月18日
角丸・円を5秒で!!【border-radius】をコピペで実装!!
要素を角丸にする場合 CSS3でのBOXを角丸にする方法のメモ。CSSのborder-radiusをつかって角丸を実装します。 CSS div{ -webkit-border-radius:10px; -moz-border-radius:10px; […]
- 2016年7月20日
- 2018年2月18日
【超便利!!】「:before」「:after」の基本的な使い方。画像やfontawesomeも挿入
:before :afterって何？？ すごく簡単に説明すると、htmlで記述してないけど、文字をcssのみで反映させたかったり htmlで記述してないけど、ボックス要素を作りたかったり htmlでは書いてないんだけど！！ってときに使う疑似要素！ h […]