第五篇 CSS入门 明白 三种嵌套形式,三种常用控制器
CSS入门
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
p{
color:grey;
}
</style>
</head>
<body>
<p>我是灰色衣服</p>
</body>
这就是内嵌形式,在head里写入style标签,然后在里面写出元素的名字,或者id、class,来指定这个元素,用花括号包起来,里面也是键值对。
外联:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="mycss.css"/>
</head>
<body>
<span>我是外联,给我上黑色衣服</span>
</body>
</html>
css里面的代码:
span{
color:#000;
}
因为head标签里面使用了 link标签找到了css样式表,所以在里面外面写css代码,就会给html做出表现,换句话说就是给它穿上衣服。
这里再说一下,以上我们使用的是 元素选择器来控制的css样式,那么我们说一下它最基础的三种选择器:
ID选择器,class(类)选择器,元素选择器。
优先级同上,ID最高,它们的写法:
ID选择器:
html:
<div id="div1"></div>
css:
#div1{
color:lavender;
}
class选择器:
<div class="div1"></div>
css:
.div1{
color:yellow;
}
元素选择器:
html:
<div></div>
css:
div{
color:blue;
}
重点注意它们的写法。选择器只能用在外联、内联。内嵌直接style直接上衣服,大家注意,class是可以控制多个元素一起用,而id整个页面只能唯一,否则会报错。
老师的课程比较慢,因为考虑到一部分入门的同学,大家主动点学习。有问题可以评论,在老师理解范围内,都能解决哟
第五篇 CSS入门 明白 三种嵌套形式,三种常用控制器的更多相关文章
- iOS开发UI篇—iOS开发中三种简单的动画设置
iOS开发UI篇—iOS开发中三种简单的动画设置 [在ios开发中,动画是廉价的] 一.首尾式动画 代码示例: // beginAnimations表示此后的代码要“参与到”动画中 [UIView b ...
- 前端js,css文件合并三种方式,bat命令
前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...
- python 中增加css样式的三种方式
增加css样式的三种方式: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- css中的三种基本定位机制
css中的三种基本定位机制 a.普通文档流 b.定位:相对定位 绝对定位 固定定位 c.浮动 1.普通流中,元素位置由文档顺序和元素性质决定,块级元素从上到下依次排列,框之间的垂直距离由框的垂直mar ...
- CSS中的三种基本的定位机制(普通流、定位、浮动)
一.普通流 普通流中元素框的位置由元素在XHTML中的位置决定.块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin计算得到.行内元素在一行中水平布置. 普通流就是html文档中的元素如块 ...
- 应答流式RPC 请求流式RPC 向流式RPC 流式RPC的三种具体形式
https://mp.weixin.qq.com/s/pWwSfXl71GQZ3KPmAHE_dA 用Python进行gRPC接口测试(二) 大帆船 搜狗测试 2020-02-07 上期回顾:用P ...
- ASP.NET提供三种主要形式的缓存
ASP.NET提供三种主要形式的缓存:页面级输出缓存.用户控件级输出缓存(或称为片段缓存)和缓存API.
- 关于linux三种网络形式
今天是开始的第一天,额,没什么仪式.舍友偶然间提醒我,应该把学习的东西,做一下规划和整理.我想一想也是对的.所以开通了这个.希望以后回来可以看看自己曾经的幼稚,那证明了我不断在学习在进步.最近在准备C ...
- File类的构造方法:三种重载形式(新手)
//导入的包.import java.io.File;//File类的构造方法 三种重载形式//创建的一个类.public class zylx1 { //公共静态的主方法. public stati ...
随机推荐
- LC 609. Find Duplicate File in System
Given a list of directory info including directory path, and all the files with contents in this dir ...
- C++ 学习安排
第一阶段主要是理解概念及最基本的定义和声明包含以下内容:1. 头文件2. 命名空间3. 变量和基本类型4. 函数5. 类6. 标准库类型第二部分进阶入门,主要学习C++中的某些内容的特殊性及逻辑编写1 ...
- JNI知识扩展
JNI(Java Native Interface,JAVA原生接口) 使用JNI可以使Java代码和其他语言写的代码(如C/C++代码)进行交互. 问:为什么要进行交互? |- 首先,Java语言提 ...
- springboot2.0数据制作为excel表格
注意:由于公司需要大量导出数据成excel表格,因此在网上找了方法,亲测有效. 声明:该博客参考于https://blog.csdn.net/long530439142/article/details ...
- 关于Win7 64位下:Navicat无法连接64位Oracle 11gR2:Cannot load OCI DLL解决方法
错误描述 在Win7下安装了Oracle 11g R2,在用Navicat去连接Oracle时,提示以下错误: Cannot load OCI DLL, 126: Instant Client pac ...
- win + T 快捷键
和 alt + tab 不同,win + T会在 在任务栏间的程序间进行switch
- 阶段3 3.SpringMVC·_02.参数绑定及自定义类型转换_6 自定义类型转换器代码编写
mvc是基于组件的方式 类型转换的接口Converter,想实现类型转换,必须实现这个接口 Ctrl+N搜索 converter 这是一个接口类 它有很多的实现类.S是字符串.后面T是指要转换类型 新 ...
- go 基础 处理异常
package main import "fmt" func main() { dosomething() } func dosomething(){ defer func() { ...
- 【.NET】由于代码已经过优化或者本机框架位于调用堆栈之上,无法计算表达式的值。
前言 上段时间做项目时,遇到如题之类问题,如今过去有一段时间了,具体出现的情形忘了,当时虽然找到了解决方法,但是依旧没有弄明白出现此种情况是何种原因,后来在微软的帮助支持中心找到了答案,特此记录,以防 ...
- deepin与win10 设置共享文件
在做预料训练时用的是基于linux环境下的kenlm训练工具,然后当时发现woc? 这这这这训练出来的语言模型居然拖不到win10下使用......当时特别二,就在linux下登录邮箱给自己发邮件23 ...