HTML5(三)
来源:互联网 发布:迪达软件 编辑:程序博客网 时间:2024/06/07 03:41
1. iframe是一个内联框架,一般用在侧面导航栏的比较多,
这个标签就是在 页面有一个区域,侧面有个链接,不管点哪一链接,链接的内容都会显
到这个区域中,也就是iframe里。下面举一个列子:
<ul>
<li><ahref="js/homework1.html"target="frm">homework1</a></li>
<li><ahref="js/homework2.html"target="frm">homework2</a></li>
<li><ahref="js/homework3.html"target="frm">homework3</a></li>
<li><ahref="sign.html"target="frm">sign</a></li>
</ul>
<iframename="frm"width="100%"height="600px">
</iframe>
上的这个小例子<ul>里是4个链接,每点一个超链接都会显示在iframe框架内,<a>标签的target属性规定在何处打开链接文档。例子中的target=”frm”这个frm和iframe里的name=”frm”一样,所以都会显示在iframe。
*如果iframe里的页面要返回主页面用target的这个属性:<ahref="iframe.html"target="_parent">返回首页</a>
Target有这几个属性:
有 4 个保留的目标名称用作特殊的文档重定向操作:
_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。
_self
这个目标的值对所有没有指定目标的 <a> 标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的,除非和文档标题 <base> 标签中的 target 属性一起使用。
_parent
这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。
_top
这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
提示:这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略,因此,不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符。
2. css标签选择器
基础选择器
标签选择器
类选择器
id选择器
通配符选择器
复合选择器
标签指定式选择器
后代选择器
并集选择器
这里说几个主要的,
1. 选择器的位置
选择器可以放在html页面里也可以放在.css文件里,一般是单独放在.css里再引用
放在html页面:
<styletype="text/css">
这里放选择器
</style>
放在.css里:
直接在这里写就行了,
2. 选择器使用
(1) 类选择器 标签名{属性:值; 属性:值;}
比如说是html里有一个<p>标签,在<style></style>可以这样写选择器:
P{
Color:red;
等属性;
}
(2) 类选择器 .自定名称{属性:值;}
类选择器很重要,一定记住名称前有一个点,引用的时候在标签里用
Class=”自定名程” 例如:
.div1{
position:relative;
height:500px;
width:200px;
background-color: yellow ;
position:relative;
text-align: center;
line-height:50px;
}
这个类标签里有好多属性自己查,引用:<p class=”div1”>hello</p>
(3)id选择器 #选择器名程{属性:值;属性:值}
和类选择器很相似例如:
#div1{
width:900px;
height:500px;
background-color:#FFFF99;
margin:0auto;
}
引用:<p id=”div1”></p>看到差别了吧一个是class=“”一个是id=“”;
还有名称前面一个#一个.;
(4)*{属性:值; 属性:值;}
这个用的少,一般是初始化页面的时候用的,可以自己试试。
初始化一般是:
*{
margin:0;
padding:0;
}
还有其他的选择器:
标签指定选择器:标签名.选择器名{属性:值; 属性:值;}
特点关系: 既。。。又。。。。
例如:
<styletype="text/css">
div.div1{
color: red;
}
</style>
引用:
<div>
我会不变色
<divclass="div1">
是不是红色
</div>
</div>
你会发现只有第二个div里的字变红了,也就是class=”div1”;
(5)后代选择器
选择器 +空格+选择器{属性:值; 属性:值;...}
例如:<styletype="text/css">
divdiv{
color: red;
}
</style>
Html里代码:
<body>
<div>红色红色
<div>
div红色
</div>
</div>
</body>
显示效果:红色红色
div红色
选择器在写css和html很重要,html和css一起能干很多事呢,明天写怎么用html+css画图和做简单的动画效果。
- HTML5(三)
- HTML5(三)
- html5学习笔记三
- HTML5读书笔记(三)
- html5 文件系统(三)
- HTML5学习笔记(三)
- HTML5 基础知识(三)
- HTML5学习(三)---拖放
- HTML5标签三
- HTML5笔记三:拖放
- HTML5之Canvas(三)
- HTML5标签整理三
- HTML5的学习(三)HTML5标签
- HTML5 标签简介(三)
- HTML5学习笔记(三)
- html5的三种样式
- (三)html5的结构
- HTML5表单属性(三)
- 从零开始学习laravel web(三)
- ## MPAndroidChart-->BarChart-->点击柱颜色改变
- linux 块设备驱动(二)——块设备数据结构
- 关于Grunt安装搭建
- npm添加淘宝镜像并启动服务
- HTML5(三)
- BZOJ 1336: [Balkan2002]Alien最小圆覆盖 随机增量法
- C# 创建、部署和调用WebService的简单示例
- 《Drools7.0.0.Final规则引擎教程》第4章 4.2 activation-group& dialect& date-effective
- Java学习笔记
- Java内存溢出(OOM)异常完全指南
- linux 块设备驱动 (三)块设备驱动开发
- Axios使用手册
- 递归问题——以全排列、青蛙过河问题为例