ホームページの作り方 〜応用編15〜
2019年11月10日
みなさま、こんにちはー(*´ω`*)ノ
花です(*´ω`*)
今日は土曜ということで、今回の記事は家で書いています。
午前中にあった用事を済ませて、お昼は友達とランチしてきました(*´ω`*)
同業(ホームページ作成)の友達なので、仕事の話やその友達は結婚してるので子どもの話などかなり盛り上がって、結局2時間近くお店にいてしまいました><
というわけで、今回のこの記事は、現在の日時、11月9日の23時半に書いています(*´ω`*)
書きあがるのは何時になることやら……(;^ω^)
いつもなら午前中に書き上げるので、ちょっと変な感じがします。
では、今回は「ホームページの作り方 〜応用編15〜」となります。
前回の続きとして線のひき方のお話です(*´ω`*)
さて、質問です。
最近は見ることもなくなった「パラパラ」というダンス(?)を知っているでしょうか?
このパラパラの語源は何でしょうか?
正解は、最後に(*´ω`*)
ここからが本題。
前回、borderという線を引くためのプロパティのお話をしました。
覚えてらっしゃるでしょうか?
基本スタイルは
border-width → 太さ
border-style → 線種
border-color → 色
ですが、まとめてしまって
border: 1px solid #ff0000;
のように書くこともできるってお話をしました。
思い出せなーい><って方はよかったら前日の記事を見てくださいね(*´ω`*)
今回は、上下左右それぞれ個別に線の太さや線種などを変える方法です。
先に行ってしまうと、
上 → top
右 → right
下 → bottom
左 → left
となります。
なので、これを組み合わせた結果は、例えば上(top)の場合なら、
border-top-width
border-top-style
border-top-color
となります。
残りの左右や下はこのtopの部分を入れ替えればいいです。
でも、これだとやっぱりめんどくさいですよね><
もちろんこれも短縮できます!
border-top
border-right
border-bottom
border-left
あとは、いつも通り太さ(ピクセル単位)と線種と色を半角を開けて入力するだけです。
これは今までと一緒です(*´ω`*)
試しに1つ書いてみると、
p {
border-bottom: 3px dashed #0000ff;
}
このような感じです(*´ω`*)
ということで、borderのお話でした。
では今回はこの辺でー(*´ω`*)ノ
質問の答えは、
a-haの「Take On Me」のイントロ部分でパッパパラッパというフレーズがパラパラの語源に当たるのだそうです。
それでは、~~~ヾ(*'▽'*)o マタネー♪
花です(*´ω`*)
今日は土曜ということで、今回の記事は家で書いています。
午前中にあった用事を済ませて、お昼は友達とランチしてきました(*´ω`*)
同業(ホームページ作成)の友達なので、仕事の話やその友達は結婚してるので子どもの話などかなり盛り上がって、結局2時間近くお店にいてしまいました><
というわけで、今回のこの記事は、現在の日時、11月9日の23時半に書いています(*´ω`*)
書きあがるのは何時になることやら……(;^ω^)
いつもなら午前中に書き上げるので、ちょっと変な感じがします。
では、今回は「ホームページの作り方 〜応用編15〜」となります。
前回の続きとして線のひき方のお話です(*´ω`*)
さて、質問です。
最近は見ることもなくなった「パラパラ」というダンス(?)を知っているでしょうか?
このパラパラの語源は何でしょうか?
正解は、最後に(*´ω`*)
ここからが本題。
前回、borderという線を引くためのプロパティのお話をしました。
覚えてらっしゃるでしょうか?
基本スタイルは
border-width → 太さ
border-style → 線種
border-color → 色
ですが、まとめてしまって
border: 1px solid #ff0000;
のように書くこともできるってお話をしました。
思い出せなーい><って方はよかったら前日の記事を見てくださいね(*´ω`*)
今回は、上下左右それぞれ個別に線の太さや線種などを変える方法です。
先に行ってしまうと、
上 → top
右 → right
下 → bottom
左 → left
となります。
なので、これを組み合わせた結果は、例えば上(top)の場合なら、
border-top-width
border-top-style
border-top-color
となります。
残りの左右や下はこのtopの部分を入れ替えればいいです。
でも、これだとやっぱりめんどくさいですよね><
もちろんこれも短縮できます!
border-top
border-right
border-bottom
border-left
あとは、いつも通り太さ(ピクセル単位)と線種と色を半角を開けて入力するだけです。
これは今までと一緒です(*´ω`*)
試しに1つ書いてみると、
p {
border-bottom: 3px dashed #0000ff;
}
このような感じです(*´ω`*)
ということで、borderのお話でした。
では今回はこの辺でー(*´ω`*)ノ
質問の答えは、
a-haの「Take On Me」のイントロ部分でパッパパラッパというフレーズがパラパラの語源に当たるのだそうです。
それでは、~~~ヾ(*'▽'*)o マタネー♪
タグ:CSS
この記事へのコメント
コメントを書く