上のように、後ろに上の方にバック画像を配置し、さらに前に全体にバック画像を配置する場合に下に空間が空いているので悩んだが、
ではなかった!
作ってる途中でそれに気が付き、なんでかわからず悩むこと1時間…。
バックのレンガの部分
↓
#renga{width:100%; height:auto;
background-image:url(hogehoge);
background-position:top center;background-repeat:repeat-x;
}
前のベタ画像
↓
#nakami{width:500px;height:auto; padding-bottom:3px;overflow: hidden;
margin:0 auto;
background-image:url(img/contback.png);
background-position:top center; background-repeat:repeat-y;
}
と、思っていたのですが、それで、こちょこちょやっていたら…やはり隙間ができます!
で、いろいろ考えて解決した方法は!
#nakami{height:110%;overflow: hidden;}
と書き換えたら うまくいきました!
やった!やったよ!おか~さ~ん! そういう気持ちで47歳の秋は過ぎていくのだった…。
下に空いた2ミリほどの空間が気になって他の仕事が進まなかった…そんなオタクなヤツです。
ちなみに、こういうサイトの上部に影つけるのは…
#toppng{
background-image:url('img/topimg.png');background-repeat:repeat-x;
position: absolute;
top: 0;
left: 0;
width:100%;height:54px;
}
というようにして書くと実現できます。absoluteの綴りをよく間違えたり… この影の上にh1設定で小さくSEOを入れるのが美しいと最近はそういうデザインをしております。
もうちょっと飽きてきたけど。
←また、よくある2つコラムを包む(ラップ)するdivの背景色をauto で高さを指定した場合は…overflow: hidden;で色を追加しますと、ちゃんと中のautoに連動してキレイに指定できます。
こういうのにふちをボカシたりするcss3流行ってますね。私も角丸とか(リンク先のゆうゆさんとこのメニュー)使いますが…IEには頑張って欲しい。
←こんな写真がメルマガ登録していたら時々タダでもらえるオススメのリースフォト屋さんwww.istockphoto.com
リースフォトも昔を思うと安くなったよ。 昔はそういう事務所行ってさぁ。延々出してもらって見たもんだったけどなぁ。
なかなかいいですよ。 名前をよく忘れる…iStock 英語の名前はこの頃覚えられん。
よく使うリースフォト屋さんを書いておきます。 この頃ホントウに名前を度忘れするので。
ピクスタ(私は長い間ピクシアと思っていた)
完全無料 足成 日本名だか私の中では無料のとこという名前になっている
ここもキレイですが高い シャッターストック めったに使わない
有名具満タン たまに1月くらい契約してはたくさん落としてみるが、結局その時じゃないと使わないね。
fotolia ヘテムルの人にはサービスが…。安いけど…
でも、写真はホントウに難しいねぇ。
中小企業はデザインもプログラムも両方適当にできないといけないのであった…
プログラマーの感覚とデザイン
↑デザイン重要だって… ふ=ん
デザインについて勉強できるサイト。 センスがないと自覚しているのでこんなのも読んでいた。
関係ないですがカラーレイザープリンター安くなりましたね。
BROTHER A4カラーレーザー(LED)プリンタ 16PPM/LAN HL-3040CN
価格:¥ 31,314 通常配送無料
高さわずか25cm。薄型を極めたカラープリンタ。
カラー/モノクロともに16枚/分の高速印刷
トナー:TN-290BK(約2200枚印刷)¥ 5,114
TN-190C/M/Y(約1400枚印刷) リサイクルトナー 6780円
TN-290BK-3PK(ブラック3本パック)
TN-290CMY(カラー3色パック)¥ 13,268 約2,200枚
DR-290CL(約15000枚印刷) DR-290CL-BK(15000枚) DR-290CL-CMY(15000枚)
印刷品質:さすがに、他機種の20万円~のプリンタ、50万以上のカラー複合機に比べると、印刷品質は劣ります。
インクジェットよりいいと思いますよ。 カラーで単純に計算すると1枚9円くらいです。
買い頃だなぁ。でもモノクロレーザープリンタのトナーがまだあるんだよ。
0 コメント :
コメントを投稿
コメントありがとうございます。