CSSの様々な指定方法まとめ
CSSの基本的なセレクタとプロパティの記述の仕方は、セレクタ{ プロパティ:値; }こうですよね。複数のプロパティを指定する方法も、次のように記述するだけです。セレクタ{ プロパティ:値; プロパティ:値; プロパティ:値; }しかし、色々な状況に応じて、もっと便利な記述をすることができるので、いくつか紹介していきたいと思います。複数のセレクタに一度にデザインを指定同じプロパティを複数のセ……
CSSの基本的なセレクタとプロパティの記述の仕方は、セレクタ{ プロパティ:値; }こうですよね。複数のプロパティを指定する方法も、次のように記述するだけです。セレクタ{ プロパティ:値; プロパティ:値; プロパティ:値; }しかし、色々な状況に応じて、もっと便利な記述をすることができるので、いくつか紹介していきたいと思います。複数のセレクタに一度にデザインを指定同じプロパティを複数のセ……
CSSをたくさん記述していくと、うっかり同じセレクタやプロパティに違うスタイルが指定されている、なんてことが起きてくるかもしれません。こういった場合、どの記述が実際に適用されているのか知っていますか? 実は、記述が読み込まれて表示されるのには優先順位があります。スタイルの優先順位スタイルの優先順位ですが、同じ要素の同じプロパティに、違う値を指定してあったとします。p {color:red;} p ……
太さを変えて文字を強調することは、よくありますよね。CSSでは文字の太さを変える方法も、知っておくと便利なものが幾つかあるので、覚えておいて損はないでしょう。基本としては、boldを使って太字にします。boldで太文字を指定しよう.sample1 { font-wight: bold; }記述の仕方は上記の通りです。また、bolderとlighterというスタイルもあります。これは相対的に文字の……
背景の色を変更したい、この様な場面もよくあるかと思います。背景色の指定はとても簡単です。背景色指定のプロパティはbackground-colorなので、background-colorを使って好きな色を指定するだけです。色の指定はRGB値か色の名前で行います。背景色を指定してみようでは、実際に例を見ていきましょう。body { background-color: red; }上の様に指定すること……
これも多く使用することがあるデザインです。文字の色を変更したい時は、colorを使用します。記述の仕方などは、背景の色を指定する時と一緒で、とても簡単です。文字色指定のプロパティはcolorなので、colorを使って好きな色を指定するだけです。文字色の指定の場合も、RGB値か色の名前を使用します。文字色の指定をしてみようでは実際に、例を見ていきましょう。body { color: white; ……
CSSを記述するのに慣れてきた時に覚えるととても便利なものの1つに、隣接セレクタと呼ばれるものがあります。名前の通り、1つの要素に隣接して記述されている要素にスタイルを指定できるものです。+を使用して記述します。隣接セレクタを使ってみようでは実際に、例を見てみましょう。セレクタ+セレクタ{ プロパティ: 値; }上記の様な記述の仕方になります。例えば、h1に隣接するpの文字の色を赤くしたいとしま……
スマートフォンの機種変更の際に、電話帳の移し換えの方法がわからなくて苦労した経験をお持ちの方は多いのではないでしょうか。そんな時、Googleアカウントに電話帳を保存しておけば、面倒な手続きは一切なく、新しいスマホでもメールアドレスを使用できます。また、盗難時やスマホをなくしてしまった時にも便利なので、一度やっておくことをオススメします。Googleアカウントとの同期設定「アカウントの同期」なんて……
ゲリラ戦術を用いたユーザーテストに頼っている、小さなプロダクトチームでいつも働いてきました。私たちはこれらのテストのために、最適な数の参加者を募集しようとします。私たちは、ターゲットとなるオーディエンスを反映したグループ層であることを確認します。私たちは、より自然な行動を促し、参加者たちが陥りがちな偏見の影響を減少させる、形式張らないアプローチを利用します。 しかし、私たちがほとんど話したことが……
HTML・CSS・PHPなどの各プログラミングコードへのコメントタグの書き方をまとめました。ここで書いたコメントは実際にサイトで表示されるのではなく、プログラミング内だけに表示されるもので、主に自らが書いたコードが何を意味するかなどを分かりやすくしておくために用いられます。HTMLの場合<!-- ここに表示させないコメントを入れます -->HTMLの場合、コメントアウトは「<!-……
CSSセレクタはスタイルの適用対象を指定するコードです。ここではCSSセレクタ基本的な使い方を紹介していきます。* (すべての要素)* {color:blue;}(*)は全ての要素に対してスタイルを適用することができます。p (要素名)p {color:blue;}要素名により指定した要素に対してスタイルを適用することができます。上記例のようにpのスタイルを決定した場合pにのみ適用されます。<……