20210522—张晨曦

日志

一. 知识总结

<video>...</video>    controls显示视频控件
    

CSS

1.1 定义

层叠样式表(CSS),是一种样式表语言。

1.2 语法

选择器+一条或者多条声明

eg:

h1{color:green:font-size:14px;}

1.3 用法

(1)内联样式

(2)内部样式

(3)外部样式

使用link标签链接到样式, 标签在文档的头部。

1.4 样式优先级

内联样式>内部样式>外部样式(内部样式和外部样式的优先级取决于谁后生效)【就近原则】

1.5 选择器

(1)标签选择器

<html>
<head>
<style type="text/css">
h1{color:red;}
h2{color:blue;}
h3{color:silver;}
</style>
</head>
<body>
<h1>甘肃兰州</h1>
<h2>山西运城</h2>
<h3>云南大理</h3>
</body>

(2)CLASS选择器

1>区分英文大小写

2>哪个标签使用Class选择器,就在标签添加class属性,值就是Class选择器名称

(3)属性选择器

【attributename】 用于选取带有指定属性的元素
【attributename~=value】 用于选取属性值中包含指定词汇别的元素
【attributename=value】 用于选取带有指定属性值和值的元素

网页标签ID与ID选择器同名,会适用此样式,ID要唯一。

(5)伪类

a:link 未访问状态
a:visited 访问过后状态
a:hover 鼠标悬停状态
a:active 激活选定状态

​ 按照link->visited->hover->active的顺序进行,(简记为LVHA)

(6)后代选择器

空格就是后代

(7)子元素选择器

直接子标签适用此样式

(8)通用选择器

*{
margin: 0;
padding: 0
}

(9)组合选择器

li,p,#div1,.mydiv{
font-size: 16px;
color: red;
}

1.6 CSS的属性

(1)元素尺寸

width 宽度
height 高度

(2)四周边框

border-top-width 顶部边框粗细
border-top-style 顶部边框风格
border-top-color 顶部边框颜色
border-top 顶部边框

顶部边框border-top的书写顺序:

​ 先粗细 ( width )

​ 再风格 ( style )

​ 后颜色 ( color )

(3)底部边框

​ 底部边框就是单独设置底部的边框,让底部边框具有独立的样式。

(4)左侧边框

​ 左侧边框就是单独设置左侧的边框,让左侧边框具有独立的样式。

(5)右侧边框

​ 右侧边框就是单独设置右侧的边框,让右侧边框具有独立的样式。

(6)圆角边框(border-radius)

二. 心得体会

​ 来到这里三天,确实长了见识,马老师也讲得很仔细很有耐心,通过对HTML一天半的学习,也收获了很大一部分东西,今天已经开始讲CSS了,希望经过老师的认真传授,我能收获更多东西。

三. 疑惑

​ (1)Typora中的段落间距怎么调整?

​ (2)HBuilder X的代码怎么保存在桌面上?

标签

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1