资讯详情

重温HTML之frameset、css、选择器(示例代码)

分帧(frameset)

HTML 框架是划分窗口的技术 将一个窗口分成多个窗口 每个窗口显示不同的网页内容主要用于后台 也叫做分帧

Frameset

注意 假如你在页面上写frameset然后就不能出现了body

常用属性:

Cols 分列单位可以写像素或百分比 之后除以上内容外还可以写*(*代表剩余所有)

Rows 分行可以写像素或百分比 之后除以上内容外还可以写*(*代表剩余所有)

Frameborder 分帧边框 0/1

Border 边框粗细

Frame 如果你把窗户分成几部分,你必须有相应的几个frame标签出现

常用属性:

Name 设置区域的名称 用于跳转

Src 默认显示页面链接

Noresize 边框不允许调整

Scrolling 滚动条

yes 出现滚动条|no 不出现滚动条

CSS简介

Cascading Style Sheets 层叠样式表(级联样式表)

不需要编译文本文件 由浏览器直接执行

作用是 定义网页的外观 如 字体,背景,等等。

可以配合JavaScript做出华丽的效果

CSS 特点

精确的定位

准确地控制页面的任何元素

精细的控制

可以调整像素级别

风格与内容分离

维护方便,重用方便

使用方法

内联

写在标签上style属性称为内联

例如:

祖传牛皮癣专治老中医

内嵌

写在head标签的style标签中的属性称为嵌入式标签

例如:

p{color:red;}

外联

通过外部引入使用

例如:

基础语法

CSS 格式

选择器

负责圈定范围,收集要修改的元素

声明

冒号连接(属性名:属性值)由属性名和属性值组成,用于设置特定风格

CSS组成

分号由选择器和一个或多个声明组成

选择器{属性名:属性值;属性名:属性值;}

CSS 注释

Html 注释

样式表中的注释是一种 /* 这是注释 */

注释不能嵌套

单位

长度单位

em 倍数

px: pixel 像素 屏幕上显示的最小单位 用于网页设计。

PPI(DPI)每英寸像素点 是一个率 表示了 清晰度 精度

Pt 是标准长度单位 1pt=1/72英寸 用于印刷行业

公式: px = pt*DPI/72;

cm/mm 厘米/毫米

颜色单位

英文名: red green blue 。。。

十六进制rgb #000000 - #ffffff

Rgb

数字 (0-255) rgb(255,0,0)

百分比(0-100%) rgb(100%,0%,0%)

URL地址

不用引号 url(test.jpg)

绝对路径 url(http://www.baidu.com/test.jpg)

用单引号 url(‘./test.jpg’)

用双引号url(“./test.jpg”)

选择器

HTML选择器

就是使用html元素作为选择器

例如: p{color:red}

ID选择器

使用id作为选择器

使用方式: #id值{声明}

例如:#duang{color:red;}

Class选择器

使用class作为选择器

使用方式:.class值{声明}

例如:.butingke{color:red}

注:不要轻易使用id选择器 请多使用class选择选择器!

关联选择器

通过一级一级的向下查找得到唯一使用选择器

每个选择器之间用空间隔开

例如: ul #zhangsan b{color:red}

组合选择器

多个选择器组合在一起,中间使用逗号分隔

例如:p,.pangzi{color:red}

伪元素选择器

:link 未访问链接

:hover 当鼠标移动到链接上时

:active 选择鼠标的链接

:visited 已访问的链接

只有a标签有上述四个伪元素

除了a标签,文本标签现在只有两个伪元素(hover,active)

选择器的优先级: 关联选择器>id选择器>class选择器>html选择器

排除上述内容

离得越近 优先级越高(就近原则)

如有错误,请指出! 及时纠正!

标签: ppi0001495连接器

锐单商城拥有海量元器件数据手册IC替代型号,打造 电子元器件IC百科大全!

锐单商城 - 一站式电子元器件采购平台