CSSでよく忘れがちなのでメモしておく。
#div1 { color:black; background-color:white; position:absolute; top:20px; left:40px; width:200px; height:300px; }
ダブルクォートが不要
<div id=div1> hoge </div>
<link rel="stylesheet" href="css/style.css">
<script type="text/javascript" src="style.js"></script>
window.onload = function() { $("#div2").css("color", "black"); $("#div2").css("background-color", "blue"); $("#div2").css("position", "absolute"); $("#div2").css("top", "20px"); $("#div2").css("left", "340px"); $("#div2").css("width", "200px"); $("#div2").css("height", "300px"); }
http://www.electrictoolbox.com/jquery-mouse-co-ordinates-mouseover-click-within-element/
<div id="example2-xy" class="mouse-xy">MOUSE XY</div> <div id="example2" class="mouse-click">MOUSE CLICK AREA</div> <script language="Javascript"> $('#example2').mousemove(function(e){ var x = e.pageX - this.offsetLeft; var y = e.pageY - this.offsetTop; $('#example2-xy').html("X: " + x + " Y: " + y); }); </script>
http://w3g.jp/webstandards/hack/css_block_control
http://www.stylish-style.com/csstec/basic/p-boxc.html
.box1{ text-align:center; width:100%; }
.box2{ text-align:left; margin:0px auto; width:150px; }
<div class="box1"> <div class="box2"> </div> </div>
ポイントは2重にくくるってことと、内側の指定は幅を入れるってところかな。
height:100%; width:100%; margin: 0px auto; padding: 0px;
下の方法はいまいち使い勝手が良くない感じ
http://www.css-lecture.com/log/css-beginner/026.html
親要素を幅100%にしておいて、 自身の幅要素を80%とか小さめにする。 そんで、
margin: 0 auto;
コツはdivタグを2重にする。
<div style="position:relative;"> <div style="position:absolute;">
</div> <div>
たぶんこんなかんじ
http://www.zachgraeve.com/2006/10/01/center-abosulte-position-div/
http://d.hatena.ne.jp/kudakurage/20111113/1321170623
http://www.midwinter-dg.com/blog_demos/css-text-shadows/
HTMLのエレメントに -webkit-transform:translateZ(0px) を設定するとGPUで処理が行われる為、フレームレートが倍になる。
http://www.smile-peace4.com/?p=5105
span style="text-decoration:underline; color:blue;"><span style="color:black;">青いアンダーラインを引く</span></span>
せっかくデザインしてもiFrame内に入れるとレイアウトがずれる可能性があるので、 あらかじめ、自分がデザインする時に気をつけることをメモしておく。
body { background-color: #000000; margin: 0px; }