html/cssのわからん→解決!メモ

スポンサーリンク

Sponsored Link




久々の投稿です。

ここにも現在学習中のhtml/cssのメモ代わりとして、投稿していこうと思います。

スポンサーリンク

今回のわからん→解決!はhtml/css

「headerのimg画像の上に、メニューナビ項目を重ねて表示する」

がわからないです。

完成したい図はこちら▽

このようにheader画像の上にメニューを重ねて表示するようにしたいのですが、うまくいかない。

なんか、調べてみたらdivをたくさん使われている例を挙げる方もいたのですが、僕の師匠からはdiv多様はオススメしないとのこと。

現在でもdiv多様のサイトは結構あるようですが、今後はもっとスマートな書き方に変わるので変な癖はつけないほうがいいということなので、

違う方法を探している状態です。

▽こんなんなっています。

これがあと一年くらいすればこの内容も軽く人に教えてあげれるレベルになるんだろうなぁ、って想像しながら軽いノリで進めています。

どんどん楽しみになっています。

調べたりして参考になったサイトもリンクを張っておきますね。

かいけつ!!

方法はCSSです。

CSSにてBackgroundをheaderへつけたいイメージ画像を背景にする

ということでできました。 コードで言ったらこんなカンジ▼(CSS)

header {  background: url(../img/bg.jpg) no-repeat top/cover;}

※注意点 

ここで参照するimgフォルダの階層に注意すること 

フォルダの階層が1つ目なら上記コードの「 .. 」は1つとなる。

フォルダの階層が2つ目なら上記コードの 「 .. 」は2つとなる。

あと、

このコードだけではちゃんとイメージ画像を画面いっぱいにならないのでちゃんとあとから装飾していくようにする。(更新して見たらわかりますね。)

できました。

html/css、だけでなく勉強中のPhotoshop、WordPressの学習メモも載せていこうと思います。

1.わからない内容を書き出しメモ投稿する

2.解決した方法を載せる

という流れでいきます。当然解決までいろいろ調べてインプットしたり、アウトプットして検証してみたりということなので、ページの開始から完了まで時間差があります。

このように進めていこうと思います。

本日の彼らとのふれあい

僕の自宅での出来事

自宅外にて妻と夕方の散歩へと行く前でした。

僕が玄関から先に出ていて、妻が出てくるのを待っていました。

妻は玄関の中でお義母さんとなにかお話をしていたらしく、僕はその話が済むまで外で待っていました。

数分後、妻がお義母さんとの話を終えて外へ出てきたとき、なにか目に入りました。

僕のところへ向かっている妻の右肩から、

なにやら黒っぽい綿のようで、モヤがかった透明のような煙のようなモノ?が

す~、っと降りて(落ちて?)いくのが見えました。

おもむろに、妻に聞きました。

「右肩ってなにかあった?」と聞くと、

「なに?なにもないけど最近右肩がこっていて、今朝の夢では大きなワシに思いっきりつかまれてイタイ感じだったよ。」

とのこと。

それにいろいろと最近は頭が忙しくて今日で準備も終わったらしく、何かしら開放感はあったらしい。

僕の見たところあの「黒い煙」(のようなもの)はイヤな感じはしなかったので、おそらく妻のことを見守っていてくれていた妖精的かと思います。

html/csshtml/cssWebデザイン
スポンサーリンク
スポンサーリンク
スポンサーリンク
内面をさらしたくないDaizen大全ブログ

タイトルとURLをコピーしました