0908期 HTML Frameset框架和选择器
来源:互联网 发布:mysql输出语句 编辑:程序博客网 时间:2024/05/08 01:36
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 width: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 width: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 width: 100px;10 height: 100px;11 background-color: blue;12 }13 /*class选择器*/14 .div2{15 width: 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 width: 100px;36 }37 38 [shuxing=abc]{39 width: 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="width: 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>
阅读全文
0 0
- 0908期 HTML Frameset框架和选择器
- html---------frameset和frame框架
- html 框架 frameset
- HTML框架----frameset&iframe
- html 框架frameset
- 【HTML】4.Frameset框架
- HTML框架集<frameset>
- html frameset框架
- html框架--frameset
- html框架(frameSet)
- 简述html中框架Frame和Frameset的用法
- html中的div span和frameset框架标签
- html frameset和iframe
- html-frameset-框架案例1
- HTML框架问题学习 <frameset>
- 学习HTML,网页框架Frameset
- 笔记 - 6、HTML - 框架--frameset
- html框架综合练习(frameset)
- 9月笔试题总结
- GIT的使用详解
- SQL SERVER 学习笔记
- Jenkins
- web部分笔记(2)spring部分
- 0908期 HTML Frameset框架和选择器
- Spring MVC入门(一)
- AsyncQueryHandler分析
- 集线器、网桥、交换机、路由器、网关大解析
- 网络请求
- more effective C++条款十解析
- C++程序设计原理与实践之GUI程序实现问题
- pycharm 解除默认unittest模式
- 源码分析Java的观察者模式