4/25 もう一ヶ月・・・・

過ぎてしまった。早いものです。
そして今日から次の訓練が始まっている。
昨年初日にちょっと緊張しながら教室に行った事を思い出す。
今日から半年間本当に貴重な勉強が出来るので、受講生の皆様体に気をつけて頑張ってください!!
先生もくれぐれもご自愛ください!!!

訓練終了翌日から2週間ほど学校のサイトのリニューアルをさせて頂き、いきなりのグループでの実務で、作業の進め方等いろいろ新たな事を勉強しました。
やはり実務になるとデザイン、コーディング全てにスピードが求められるので、今まで授業でいかにちんたら作業していたか思い知らされ、画像の作り方、スライスのやり方(最大限拡大して行う事!)テキストで表現できるところは画像にしない!等、超基本的な事も適当に作っていたな〜〜と多いに反省(汗)
カンプの段階でマークアップCSSを想定しながら作れていればコーディングスピードが上がるので、少しは勉強した効果があったかな〜と思う事もあり、やはり作りあげる事は楽しいと実感しました。

サイトの本アップは5月以降で変更もあるかもなので、とりあえず備忘記録としてメモ。

Q&Aページデザイン&コーディング

  • 外枠ドット上下画像HTMLで配置。
  • 外枠・backgroundに外枠ドット画像repeat配置
  • メイン部分・backgroundに顔写真position:left topで配置
  • 吹き出し・float:rightで配置
  • Q&Aテキスト・margin-leftで配置 

li要素を改行しても頭を揃える(数値はサイトによって変わる)

.text 	li {  
 text-indent: -3em;  /* 1行目の余白を調整  */
 margin-left: 3.6em;  /* 左に3.6em分字下げする */ 
} 

IE6で透過pngを表示させる「DD_belatedPNG.js」

ここの「○○○-min.js」のJavaScriptをコピーして「DD_belatedPNG.js」として保存。
htmlのhead部分に、下記のように記入する。

<!--[if IE 6]>
	<script src="js/DD_belatedPNG.js"></script>
	<script>
		DD_belatedPNG.fix('img, .png');
	</script>
<![endif]-->

4行目img, .png要素全てに透過が反映される。
要素名やid名、クラス名を記入しても良い。

こちらを参考にさせて頂きました。