frameset框架
frameset与body没法同时使用，frameset用来分割页面，frame在frameset用于引用其他网页
1 <frameset rows="100,*" frameborder="no"> --上下分，第一行100像素，剩余为第二行；rows换成cols，则上下分变为左右分。frameborder=“no”，去掉分割线。 2 <frame src="页面地址" noresize="noresize"> --noresize，禁止窗口调整大小 3 <frame src="" scrolling="no"> --scrolling="no",取消显示滚动条 4 </frameset>
iframe在原来页面嵌入小窗口显示其他页面
1 <iframe src="其他页面的地址" width="" height="" frameborder="0" scrolling="no"></iframe>
frameborder，边线；scrolling，滚动条。如果设置高和宽为0，则不显示，但是在后台会存在这么一个页面，该页面会在后台刷取流量。
选择器
1、标签选择器。用标签名做选择器。
1 <style type= "text/css"> 2 p //格式对p标签起作用 3 { 4 样式; 5 } 6 </style>
2、class选择器。都是“.”开头。
1 <head> 2 <style type="text/css"> 3 .main /*定义样式*/ 4 { 5 height:42px; 6 100%; 7 text-align:center; 8 } 9 </style> 10 </head> 11 <body> 12 <div class="main"> <!--调用class样式--> 13 </div> 14 </body>
3、ID选择器。以“#”开头
1 <head> 2 <style type="text/css"> 3 #main /*定义样式*/ 4 { 5 height:42px; 6 100%; 7 text-align:center; 8 } 9 </style> 10 </head> 11 <body> 12 <div id="main"> <!--调用id样式--> 13 </div> 14 </body>
4、复合选择器。
1）用“，”隔开，表示并列。
1 <style type="text/css"> 2 p，span /*标签p、span两者同样的样式*/ 3 { 4 样式; 5 } 6 </style>
2）用空格隔开，表示后代。
1 <style type="text/css"> 2 .main p /*找到使用样式“main”的标签，在该标签里的P标签使用该样式*/ 3 { 4 样式； 5 } 6 </style>
3）筛选“.”。
1 <style type="text/css"> 2 p.sp /*在标签p中的class="sp"的标签，执行以下样式*/ 3 { 4 样式; 5 } 6 </style>
随堂
1 <html> 2 <head> 3 <meta charset="UTF-8"> 4 <title></title> 5 <link rel="stylesheet" href="css/css1.css" /> 6 <style> 7 /*id选择器*/ 8 #div1{ 9 100px; 10 height: 100px; 11 background-color: blue; 12 } 13 /*class选择器*/ 14 .div2{ 15 100px; 16 height: 100px; 17 background-color: green; 18 } 19 /*标签选择器*/ 20 div{ 21 border: 5px solid #000; 22 } 23 /*全局选择器*/ 24 *{ 25 margin: 0px; 26 padding: 0px; 27 } 28 /*复合选择器*/ 29 /*子代选择器*/ 30 .div3 span{ 31 color: red; 32 } 33 /*并列选择器*/ 34 .div3,.div4{ 35 100px; 36 } 37 38 [shuxing=abc]{ 39 100px; 40 height: 100px; 41 } 42 43 a{ 44 color: black; 45 text-decoration: none; 46 } 47 48 .div4:hover{ 49 cursor: pointer; 50 transform: rotate(45deg); 51 transition: 1s; 52 } 53 </style> 54 </head> 55 <body> 56 <div style=" 100px;height: 100px;background-color: red;"></div> 57 <div id="div1"></div> 58 <div class="div2"></div> 59 <div class="div3"> 60 <span>几个字</span> 61 </div> 62 <div class="div4"> 63 <span>几个字</span> 64 </div> 65 <div shuxing="abc"></div> 66 <a href="http://www.baidu.com">超级链接</a> 67 </body> 68 </html>