圧倒的成長日記-5日目-

日記パート

↑これ、あったりなかったりするけどまぁいいや。わかってたことだけど朝起きて雨の音に絶望する。所用(*3)で大阪に行かないといけなかったのでしぶしぶ家を出る。
長堀橋でコミケ頼まれ者の前金を受け取って友人の劇団の舞台へ。演劇は初めてだったけどとても楽しめた。あのライブハウスみたいな非日常感大事ですね。脚本は個人的に好きな感じだったのでよかった。アイマス同人でカバーしたい。

所要の一つだったインターンオリエンが台風で消失したので一緒に見に来てた高校時代の友人とご飯食べてちょっとゲーセンで時間つぶして京都に帰った。パチスロ屋はなんかすごかった。

勉強パート

8章はjqueryだったので買ったjquery本でやるか、という気分（この本飽きてきた）。いちいち試すのがだるかったのでここにざっと書くに留める。あとboostrap,lessあたりの技術、学べばかなり生産性が高そうな感じあるけどメインドキュメントがEnglishでうーむとなっている。生コーディングするよりは手間が少ないのかもしれないけど、どうしたもんかな。

HTML

プロパティ

vertical-align:テキストの縦方向の位置揃え調節
opacity:透明度。画像リンクに対してa:hoverとかでこれをやるとそれっぽさが生まれる

ボタンの作りかた

まず

<p class="btn"><a href="#">ぷよぷよ</a></p>

とかやっとく（ボタンの元）。
これに対して、

text-decoration:none;//下線消し
color:#FFFFFF;//文字色
background-color:#058BA9;//ボタン自体の色
padding:10px 20px;//ボタン領域拡大
border-radius:5px;//ボタンの角を丸く。ボタンっぽくするの大事
//グラデーション
background-image:-webkit-linear-gradient(top,#92CDDB,#058BA9);
background-image:linear-gradient(to bottom,#92CDDB,#058BA9);//上行のベンダー差分。
border:1px solid #058BA9;//枠線。
box-shadow:1px 1px 0 #9DDDED inset;//ボタンを立体的に。
text-shadow:0px -1px 0 #333333;//テキストの影。
display: inline-block;//インラインブロック要素に変換（前のエントリを参照
その他

ボックスに対して半透明背景を設定
先述のopacityプロパティとの違いとして、あれはボックス全体への適用なので文字も込みで半透明になるのに対し、これは背景へのアプローチなので、背景だけを透過できる。

background-color:rgba(0,0,0,4);//読んだまま

絶対配置

postion:absolute;
left:50px;
bottom:50px;

デフォルトだとウィンドウが基準になる。親要素に

postion:relative;

とすると、この絶対配置の基準がその親要素になる。
他に、"fixed"という配置がある。これもabsoluteと同様ブラウザウィンドウを基準に配置される。
異なる要素として、こっちはスクロールについてくる。
あと重なってしまったときの、全面優先度として

z-index n:

というプロパティがある。nは自然数。値が大きいほど上にくる。

SEO？
内に、

<meta name="description" content="説明">

これがあると検索エンジンが拾ってくれるらしい。ほんとかな。うそかも。
今日はここまで。