今天上午老师带着我们复习了一下上周学的html的各种标签,然后又讲了css,讲了css三种主要形式:内联式,内嵌式,外部样式表。
还有就是标签选择器、class选择器、id选择器、符合选择器的用法。
然后就是布局,这个听起来还是有点迷的, 迷迷糊糊的就开始做练习,有问题就要在实践中去解决!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
*{position:fixed }
*{position:absolute }
*{position:relative}
<!--.q{background-color:#CC99CC; 100px; height:200px;}-->
.q{ 150px; height:50px; border:2px solid red;}
.qq{ 150px; height:50px;border:2px solid red;}
#w{ background-color:#000099; position:absolute; 20px; height:20px; top:-45px; right:125px;}
#ww{ background-color:#33FF00; position:absolute; z-index:2; 20px; height:20px; top:20px; right:20px;}
#www{ background-color:#99CCFF; position:absolute; z-index:3; 20px; height:20px; top:20px; right:20px;}
</style>
</head>
<body>
<div class="q"></div>
<div class="qq">
<div id="w">c</div>
<div id="ww">d</div>
<div id="www">e</div>
</div>
<!-- position
position:fixed 固定
position:absolute 绝对定位
1只有本身:也是在页面中定位(根据top属性定)
2有嵌套关系
第一种 嵌套他的标签没有position 还是在页面中定位
第二种 嵌套他的标签有position那就在嵌套他的标签里面定位
position:relative
top letf rihgt bottom
-->
<!--<div style="background-color:
#CC0000; 40px; height:40px; position:fixed;"></div>
<div class="q"></div><br />
<div class="q"></div><br />
<div class="q"></div><br />
<div class="q"></div><br />
<div class="q"></div><br />
<div class="q"></div><br />-->
</body>
</html>
刚开始各种小错误,找不到方法,然后就和同学们商量,这个具体怎么做。然后找到了规律,只要找到了规律,让方块动起来也自然很简单了。今天学习的东西都很重要,要多多练习,又是收获满满的一天! 加油!