第六堂课 框架和样式表的基础

<iframe src="选择一个页面"></iframe>

一个双标签元素,它的主要作用是在浏览页面上添加一个页面

中间可以添加属性来控制页面的大小和其他功能,例如  width="页面的宽度" height="页面的高度" frameborder="0或1"这是控制边框,scrolling="yes或no"这是是否显示滚动条的意思,如果高和宽都为0,则在页面上看不到了,但被隐藏的页面依然在运行着

再说一个双标签元素, <frameset></frameset>   如果有它,就不要<body></body>了

<frameset cols="300,700">

cols是左右分的意思,也可以用属性词rows,它是代表上下分。如果左边的数是300,左边的是*,那右边就是占剩下所有的像素,举个例子

<frameset cols="300,*">

< frame src="网页地址"/>

<frame  src="网页地址"/>

</frameset>

嵌入两个网页,左边是300,右边是*,就是除去300剩下占所有

再说一下制作滚动文字

在<body></body>内制作

<marquee>滚动文字</marquee>

在marquee后面也可以添加一些属性,滚动属性是direction,决定文字的滚动方向

在内容滚动文字那里也可以换成图片< img src="图片路径"/>

举个可以设定一行字出现效果的例子

<span><mark>苹果</mark>很好吃</span>

苹果这两个字那里会有黄色背景色

<hr/>可以制作分割线,要几条就在相应的行,写几个

也可以把视频嵌入到网页上,比如优酷,可以点击分享,选择复制通用代码,粘贴到代码页就可以把视频嵌入到网页上了

下面说一下样式表的基础

1、内联

在<body>的区域里写

<div style="样式">hello</div>

2、内嵌写在页面里面的

在<head>区域内写这个双标签

<style type="text/css"></style>

3、外部样式表是在网页以外的样式表

选择css创建保存

在<head>区域内,单击点css样式表点附加表,会出来< link href="test.css" rel="stylesheet" type="text/css"/>

内联样式优点,控制精确

缺点,代码重用性差,页面代码乱

内嵌样式优点,代码重用性好

缺点,控制不精确

外部样式优点,代码重用性最好

缺点,控制是最不精确的

一般用外部样式表,浏览器会有缓存

内联的样式优先级最高,内嵌其次,最后外部和内嵌一样

例<div style="color:#F00">hello</div>

这是内联,样式名:样式值,多个样式之间用分号隔开

内嵌 <style type="tee/css">

</style>

*{color:#60F}

*代表元素所有元素

#{color:#0F0}

#代表id选择器

.cl{color:#630}

<div class="cl">文字</div>

用id举个例子

用<div></div>控制内容

< div id="d1">准确控制</div>

id=""同一个页面是不能重复的,里面取的代号不能使用中文打头,可以用英文打头

标签选择器

<span>这是span1</span>

<span>这是span2</span>

span{color:#cF6}

如果是div,就是div{color:#cF6}

样式表的注释语法是/**/

四中选择器优先级区分

标签选择器要大于星号的

class选择器要大于标签选择器

id选择器要大于class选择器

越精准优先级越高

复合选择器并列

<div>测试一</div>

<span>测试二</span>

div,span{color:#60F}

,是并列的效果

<div id="d3">

<div>后代1</div>

<div>后代2</div>

</div>

#d3空格div{color:#60F}

空格代表子级

<ul="u1">

<li>列表1</li>

<li>列表2</li>

</ul>

#u1空格li{color:#F66}

div.cl{color:#F60}是从所有div里找到class=cl的,仅代表class,如果找id是不可以的

时间: 2024-12-26 11:19:06

第六堂课 框架和样式表的基础的相关文章

QT开发(六十五)——QT样式表编程实例

QT开发(六十五)--QT样式表编程实例 一.QComboBox组合框样式定制 1.基本定义 QComboBox  {     border: 1px solid gray;     border-radius: 3px;     padding: 1px 2px 1px 2px;  # 针对于组合框中的文本内容     min-width: 9em;   # 组合框的最小宽度 } QComboBox::drop-down {     subcontrol-origin: padding;   

表单,框架,样式表的分类及选择器基础

表单元素1.<from>代表表单,其中属性有action提交给你所设定的页面,method数据提交的方式(get显示提交有长度限制,post隐式提交). 2.文本的表示类型:1.文本框<input>其属性有type类型选择其中的text,valune是文本框的值,name是文本框的名称.2.<input>密码框,其中属性tybe选择password.3.隐藏域其tybe选择hidden.4!文本域用双标签<textarea>,他的值是写在开始和结束标签之间的

框架与样式表的基本概念

框架:           frameset :框集.  如果使用框架集,当前页面不能使用body.    cols="300,*",左右拆分,左300,右完剩余.  frameborder 边框 frame:src(框架要显示页面的地址), scrolling(滚动条) iframe(可以嵌在普通页面里面):src(框架里面要显示的页面地址), wigth(框架的宽度), height(框架的高度), frameborder(框架的边框), srcolling(滚动条) 其他:  &

框架,样式表的一些认解,今天这节可有点不在状态,正在规划学习流程,让自己更快的提升起来。看着其他小伙伴都太厉害啦。努力!0909上

框架: frameset:   框架集   如果使用框架集,当前页面不能有body cols=" 300,* "     左右拆分,左边宽300,右边宽剩余 rows=“300,*”     上下拆,上边高300,下边高剩余 framebodey   边框 <frame> :src   框架要显示页面的地址 .  scrolling   滚动条 iframe:   可以镶在普通页面里面 sre  框架里面要显示的页面地址 width 框架的宽度 height 框架的高度 f

5/25,C语言的第六堂课

1.数组 数组是一组有序数据的集合,数据中的数据排列下标代表数据在数组的序号:数组中每一个元素都属于同一个数据类型,不能把不同的数据类型放在同一个数组里面. 2.如何定义一对数组 要使用数组,必须在程序中先定义数组,要清楚那些数据构成数组,数组中有多少元素,属于哪个数据类型.数组的一般形式是,类型符 +数组名[常量表达式]. 3.怎么引用一维数组元素 定义数组之后,就可以引用数组中的元素,应该注意的是,只能引用数组元素而不能一次整体调用整个数组全部元素的值.数据名的小标赋值表达式是表达对数组元素

CSS样式表继承详解

最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始.文档树由HTML元素组成. 文档树和家族树类似,也有祖先.后代.父亲.孩子和兄弟^_^.这很容易理解吧,笔者在这里就不一一赘述了.希望深入了解的朋友请google之. 那么CSS样式表继承指的是,特定的CSS属性向下传递到子孙元素. 下面举个例子,有如下html代码片段: <p>CSS样式表<

框架&amp;样式表

框架   <frameset rows上下拆分,cols左右拆分><fram src选择文件></frameset>. 样式表:"div style"写在body内显示为最高级,"#"id选择器,"."class选择器,"div"标签选择器,"*"选择全局,".A1 span"子代选择器选择所有名为.A1 span的标签须加空格,".A1,.

9.9 开课第六天(标签:框架、其他)(样式表:分类、选择器)

[3] rows="300,*"   上下拆,上边高300,下边高剩余                                          [4]frameboder   边框                                          [5]<frame>   src     框架要显示页面的地址                                                                 scroll

基于Extjs的web表单设计器 第六节——界面框架设计

基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extjs的web表单设计器 第四节——控件拖放 基于Extjs的web表单设计器 第五节——数据库设计 基于Extjs的web表单设计器 第六节——界面框架设计 基于Extjs的web表单设计器 第七节——取数公式设计 基于Extjs的web表单设计器 第八节——表单引擎设计 这一节我给大家介绍一下表单设