オンラインティーチャー・ゾノのブログ

» 【AI時代に乗り遅れたかも?】ご安心ください!!今なら、まだ間に合います!AIは、あなたのビジネスを加速させるために必要不可欠です。今さら誰に聞けばいいの? → こちらのビデオで解消できます!

CSSに関する記事一覧


CSS

カーソルを合わせると色が変わる仕組みを把握しておくと、CSSの理解度がUPします。何気ない色の変化ですが、ブログ運営をしていくときには必要なCSSの知識なので、把握しておくといいです。マウスオーバーと言って、CSSに「:hover」と入力するだけで実装可能です。ブログ初心者の人も、ぜひどうぞ。

CSS

きれいなブログ運営をしていくためには、スマホ表示とパソコン表示でCSSを分岐する必要があります。少し難しそうに感じるかも知れませんが、簡単です。メディアクエリを使用すれば簡単に実装できるので、スマホとパソコンで見え方を変えたいという場合は、メディアクエリでCSSを記述すべきです。

CSS MEMO & TEMPLATE

本記事では、画像を背景にして、文字を入力するためのCSSを掲載した記事です。コピペでOKなので、ぜひ使ってみてください。ブログにちょっとしたアクセントをつけることもできるので、読者にアピールしたいテキストなどに使うといいと思います。

CSS

本記事では、ブログで文字を太字にするための方法について、少しマニアックな話をしていきます。とは言っても、ブログ運営する人すべてにとって関係してくる話なので、ぜひご覧ください。SEO対策としても重要なポイントとなります。

CSS MEMO & TEMPLATE

ブログなどで読者の目を引くためには、画像にアニメーションをつけてみると効果的です。売れるセールスレターや反応の良いLPを意識してみると、動きが多かったりします。僕がよく使うアニメーションは本をめくるように動かすアニメーションです。CSSで簡単に実装できるのでブログに掲載しておきます。

CSS MEMO & TEMPLATE

画像の上に文字を入力してデザインをする場合、文字の表記が変更になった場合って少し面倒ですよね。その場合はCSSを使って画像の上にテキストベースで文字を表記してあげることがおすすめです。後々の編集とかも楽ですし、画像も気持ち的に軽くなるのでソースコードをブログにまとめます。

BLOG CSS MEMO & TEMPLATE

ブログで目立たせたいところにマーカーとかは不要です。AppleやGoogle、Amazonなどの大手有名サイトを見ても、キラキラとデコっているサイトはゼロ。装飾は太字程度でOKで、最近おすすめなのが「流れる文字」です。流れる文字を実装するだけでブログが一段とオシャレになり、シンプルさもキープできます。

BLOG CSS MEMO & TEMPLATE

本記事は、当ブログで使用するボタンデザインを掲載した記事です。シンプルなデザインを追求して、無駄なデザインなどは削ぎ落とすことを大きなテーマとしてブログ運営をしているので、デザインはシンプルなものが多いです。サイトのメインカラーがブラックとホワイトなので、ボタンは差し色でレッド系にしています。

CSS HOW TO MEMO & TEMPLATE

本記事は、画像を横スクロールでスライドさせるためのCSSをメモ用として保管しておくための記事です。横スクロールは、画面が縦に長くならないというメリットがあるので、ぜひ実装してみてください。コピペで簡単に使えるのでおすすめです。

CSS MEMO & TEMPLATE

追従型のバナー効果を検証してみます。試験的にブログ右下に設置しておきます。こちらもスマホ用のフッターバナー同様に効果がなければ外します。本記事にて、設置のソースコードを公開しておきますので、設置してみたい場合はチェックしてみてください。