五、框架

1.frameset是双标签框架集，如果使用框架集，当前页面不能有body。

frameset属性：①cols代表左右拆分。cols=“300，*”表示左边框架宽300，右边宽剩余的宽度。*代表剩余。

②rows代表上下拆分。rows=“300，*”表示上边框架高300，下边框架高剩余的高度。

③frameborder边框，有边框就设置为1（ frameborder="1"），没有边框就设置为（ frameborder="0"）。

④<frame />属性有a：src 边框要显示的页面的地址；b： scrolling滚动条，有滚动条就设置成yes（scrolling="yes"），没有滚动条就设置成                                                no（scrolling="no"）。

 <frameset cols="300,#">

 <frame src="样式1.css" />

 <frame src="样式2.css" />

 </frameset>

2.iframe 可以嵌在普通页面里面，其属性中的src表示框架里面要显示的页面的地址。

src的属性：①width框架的宽度

②height页面的高度

③frameborder边框，有边框就设置为1（ frameborder="1"），没有边框就设置为（ frameborder="0"）。

④scrolling 滚动条，有滚动条就设置成yes（scrolling="yes"），没有滚动条就设置成no（scrolling="no"）。

如果嵌入的页面src属性中设置成“width=0    height=0”，则嵌入的页面就看不到了，但是实际上是存在的。

3.其它

①<marquee> 双标签，表示滚动效果。<marquee>滚动字条</marquee>。<marquee>属性有<marquee direction="right">表示从左向右滚动，同样的right可以换成right、up、down，分别表示从右到左、从下到上、从上到下滚动。加入图片，图片也可以和字体一样滚动。

<marquee direction="up">

<img src="插入的图片" />
                                                           </marquee>

②<mark></mark>做标记，<mark>字体</mark>，中间的“字体”就被做了标记，颜色变成了黄色。<mark>元素中颜色不可以更改。

③<hr/>做分割线。网页上出现一条分割线。

④ 页面嵌入视频，嵌入视频的方法：a.找到要嵌入的视频

b.视频左下方点击分享

c.复制HTML代码  复制flash   复制通用代码

d.把复制的代码粘贴在页面里面

样式表

样式表的作用：样式表的作用是配合标签对网页进行美化，标签把内容放到页面里面，然后样式去操作标签，是网页更加漂亮。样式表分为内联、内嵌、外部三种。

一、内联：样式写在标签里面，<div style=""></div>。可以具体到每个代码，但是每个控制代码都要写上。优点：控制精确      缺点：代码重用性差。

二、内嵌：嵌在页面里面，一般嵌在<head>里面。

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

样式

</style>

</head>

样式表里面的注释语法为/*样式*/。缺点：控制不精确   优点：代码重用性好。

三、外部：样式表在网页的外部，有一个单独的文件。如果网页的所有控制的样式都是写在另一个文件里面的，则另一个文件就成为外部样式表。使用时要把外部样式表引入到网页文件里。引入方法为：引入：网页文件空白处点击右键-CSS样式表-附加样式表。缺点：控制没有内联的精确    优点：代码重用性最好（一个外部样式表可以用在n个网页上）。

一般样式表不要写内联的，代码太多、太乱，除非有特殊情况要写。后期主要用外部的。其中，内联优先级最高。

四、选择器

选择器就是样式表用来选取元素的。

1.标签选择器     根据标签名选择元素。

<style type="text/css">

div{ background:#C93}

</style>

</head>

<body>

    <div>123</div>

    <div>456</div>

<span>789</span>

div{ background:#C93}表示找到的标签是<div>123</div>和 <div>456</div>。只有这两行显示颜色#C93

2.class选择器     class称为类，选取一类的元素。class每个元素的属性都有。

<style type="text/css">

div{ background:#C93}

.a{ background:#F00}

</style>

</head>

<body>

<div class="a">123</div>

<div>456</div>

<span class="a">789</span>

class=“a”表示两行都为a类，class选择器根据class名就把这两行归为a类。<div class="a">123</div>和<span class="a">789</span>两行颜色成为了颜色#F00。 .a=class a，。

3.id选择器   用来精确控制，对要选择的元素命名唯一的id，id选择器找到这个元素（通过id来寻找）主要是内嵌和外联中使用。class每个元素的属性都有。通过id选择器寻找元素只能找到一个元素，因为id是唯一的。id选择器的符号是#。例如下列代码， <div id="d">456</div>的id=d，寻找时#d。

<style type="text/css">

div{ background:#C93}

.a{ background:#F00}

#d{ background:#3CF}

</style>

</head>

<body>

<div class="a">123</div>

<div id="d">456</div>

<span class="a">789</span>

4.复合选择器

①逗号并列选择器，用逗号隔开表示是并列的。下列代码同时选择了div和span。

<style type="text/css">

div,span{ background:#09F}

</style>

</head>

<body>

<div class="a">123</div>

<div id="d">456</div>

<span class="a">789</span>

②空格后代   下列代码表示找到的是4行<li>中的数字。

#list li{ background:#999}

</style>

</head>

<body>

    <ul id="list">

         <li>11</li>

         <li>22</li>

         <li>33</li>

         <li>44</li>

    <ul>

③点筛选

div.s代表筛选 <div class="s">22222</div>

<div>11111</div>

<div class="s">22222</div>

<div>33333</div>

筛选优先等级为   id（优先级高），clss（优先级其次），标签（优先级最低）。

9月9日HTML上午表单元素2（框架、样式表）的更多相关文章

  1. 只有设置了 name 属性的表单元素才能在提交表单时传递它们的值

    $(function () { var wait = $("<img src=\"\" alt=\"正在上传\"/>"); $( ...

  2. jQuery获取Select选择的Text(非表单元素)和 Value（表单元素）(转)

    jQuery获取Select选择的Text和Value: 语法解释: . $("#select_id").change(function(){//code...}); //为Sel ...

  3. HTML知识点总结之表单元素

    网页不可能是纯静态的,没有任何的交互功能:绝大多数的网站都有表单元素的使用.表单提供了一个浏览者和网站交互的途径,比如用户注册登录,用户留言等功能. form form元素只是一个数据获取元素的容器, ...

  4. HTML的表单元素

    html的表单元素主要用于让用户输入数据并提交给服务器 基本语法:<form action="url" method="提交的方法,get/post,默认为get& ...

  5. 第六十七节，html表单元素

    html表单元素 学习要点: 1.表单元素总汇 2.表单元素解析 本章主要探讨HTML5中表单元素,表单元素用于获取用户的输入数据.   一．表单元素总汇 HTML5的表单中,提供了各种可供用户输入的 ...

  6. 修改表单元素中placeholder属性样式、清除IE浏览器中input元素的清除图标和眼睛图标

    一.修改input元素placeholder属性样式 在做项目的时候,一般表单元素的placeholder属性样式都是使用浏览器默认的,但有时候为了追求设计上的美感需要修表单元素的placeholde ...

  7. 第二章 Vue快速入门--13 讲解v-model实现表单元素的数据双向绑定

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  8. HTML5: HTML5 表单元素

    ylbtech-HTML5: HTML5 表单元素 1.返回顶部 1. HTML5 表单元素 HTML5 新的表单元素 HTML5 有以下新的表单元素: <datalist> <ke ...

  9. HTML -- 表单元素1

    HTML 表单用于搜集不同类型的用户输入. 一.<form> 标签 <form> 标签用于为用户输入创建 HTML 表单. 表单能够包含 input 元素,比如文本字段.复选框 ...

  10. 9月8日HTML表单元素（form、文本、按钮、选择）

    表单元素 一.form form代表表单,功能:用于申明表单,定义采集数据的范围,也就是<form>和</form>里面包含的数据将被提交到服务器或者电子邮件里.<for ...

随机推荐

  1. 用centos光盘安装RPM包的方法

    1.在虚拟机光盘选项中设置连接路径为centos安装光盘. 2.将光盘挂载到本地目录. #新建一个文件夹 mkdir cdrom #把光盘挂载到cdrom目录下 mount /dev/cdrom cd ...

  2. SpringMVC学习--参数绑定

    spring参数绑定过程 从客户端请求key/value数据,经过参数绑定,将key/value数据绑定到controller方法的形参上.springmvc中,接收页面提交的数据是通过方法形参来接收 ...

  3. java设计优化--单例模式

    单例模式是一种对象创建模式,确保系统中一个类只有一个实例. 在java语言中,这样做有两大好处: 1.对于频繁使用的对象,可以省略创建对象所话费的时间: 2.由于new操作的次数减少,对于系统内存的使 ...

  4. Gson解析json数据

    1.解析单个对象 JSON字符串如下 [ { "formatDate":"2015-10-28", "date":"2015\u5 ...

  5. vmware 在NAT模式下连接上外网

    文章: http://www.2cto.com/os/201504/389011.html

  6. iOS开发小技巧--实现毛玻璃效果的方法

    一.美工出图 二.第三方框架 -- DRNRealTimeBlur,框架继承自UIView.使用方法:创建UIView直接继承自框架的View,就有了毛玻璃效果 三.CoreImage -- 图片加高 ...

  7. CNN中的BN

    w权值的初始化,之前最好的方法是 也就是输入神经元和输出神经元中随机一个数,然后除以输入神经元的个数开根号 因为全连接层波动较大,所以加在FC后面 这里Y,b是为了对信息的一个还原

  8. nginx正向代理，反向代理，透明代理(总结)

    1正向代理 正向代理,也就是传说中的代理,他的工作原理就像一个跳板, 简单的说, 我是一个用户,我访问不了某网站,但是我能访问一个代理服务器 这个代理服务器呢,他能访问那个我不能访问的网站 于是我先连 ...

  9. zoj3261 并查集离线处理

    Connections in Galaxy War Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%lld & ...

  10. UIScrollView实现图片轮播器及其无限循环效果

    图片轮播器: 一.实现效果 实现图片的自动轮播            二.实现代码 storyboard中布局 代码: 1 #import "YYViewController.h" ...