前言

刚刚学过HTML引入css样式的三种方式和选择器的三种样式，下面就来分享一下我的笔记吧

一. css样式的三种方式

第一种：内联定义方式

<body><div style ="样式名：样式值"></div>
</body>

第二种：样式块

<head><title></title><style type="text/css">/*选择器*/   </style>
</head>

第三种：引入外部独立css文件

在css文件中写入选择器及内容，可以是多个
css文件的引入： <head> <title></title> <link rel=" stylesheet" type="text/css" href="文件路径"> </head>

二. 选择器的三种样式

第一种：id选择器

#id{
样式名：样式值；
样式名：样式值；
样式名：样式值；
…}
例如:

<head><title></title><style type="text/css">#a{color:red;font-size:12px;}</style>
</head>
<body><span id="a">你好!</span>
</body>

第二种：标签选择器

标签{
样式名：样式值；
样式名：样式值；
样式名：样式值；
…}
例如：

<head><title></title><style type="text/css">div{color:red;font-size:12px;}</style>
</head>
<body><div>你好!</div>
</body>

第三种：类选择器

.类名{
样式名：样式值；
样式名：样式值；
样式名：样式值；
…
}
例如：

<head><title></title><style type="text/css">.student{color:red;font-size:12px;}</style>
</head>
<body><div class="student">你好，我是学生！</div><span class="student">你好，我是一名学生！</span>
</body>

三. css的绝对定位

对某一部分的位置进行设定

<head><title></title><style type="text/css">#div1{background-color: red;border :1px black solid;width: 300px;height: 300px;position: absolute;/*绝对定位*/left: 100px;  /*距离左边框*/top: 100px; /*距离上边框*/}</style>
</head>
<body><div id="div1"></div>
</body>

HTML引入css样式的三种方式，css选择器的三种样式相关推荐

Java 创建对象的 6 种方式，总有一种适合你
创建对象的 6 种方式假设有个女朋友类: @Data @NoArgsConstructor @AllArgsConstructor class GirlFriend {private String ...
html中引入css样式表的三种方式,css引用的几种方式是什么？
HTML怎么引用CSS样式?css引用的几种方式是什么?下面本篇文章就来给大家介绍一下在HTML中引用CSS样式的几种方法,希望对大家有所帮助. 1.行内式在HTML标签中,使用style属性设置C ...
vue 实例化几种方式_Vue组件的三种调用方式
最近在写fj-service-system的时候,遇到了一些问题.那就是我有些组件,比如Dialog.Message这样的组件,是引入三方组件库,比如element-ui这样的,还是自己实现一个?虽然 ...
Android:按键响应方式第一种onClick属性，第二种方法接口类，第三种方式匿名内部类，第四种方式Activity
一.在xml 中设置按键的onClick 绑定的函数新建一个工程然后在相关的页面添加一个Button 运行一下实际上,现在这个按键一,我们去运行的时候,他是没有任何的反馈的,我们按完它,他没有任 ...
python函数调用的三种方式_python函数调用的四种方式
原标题:python函数调用的四种方式第一种:参数按顺序从第一个参数往后排#标准调用运行结果: 第二种:#关键字调用注意:关键调用从哪开始的,从哪以后都必须使用关键字调用除了'*'收集参数.不能 ...
两种方式实现线程通信:三个线程交替打印AABBCC
多线程之间是抢占资源的,使用线程通信可以达到线程按序执行的目的线程共享资源类, 首先创建一个资源类, 包含三个打印的方法以及首次打印的字符串多个线程访问,方法加synchronized同步锁 cl ...
java实现线程三种方式_详解三种java实现多线程的方式
java中实现多线程的方法有两种:继承Thread类和实现runnable接口. 1.继承Thread类,重写父类run()方法 public class thread1 extends Thread ...
LaTex支持中文的三种方式（首推第一种）
转自:https://blog.csdn.net/z_feng12489/article/details/90449495 我们知道 Latex 一般用 CJK 和 CTEX 宏包支持中文编辑,CJK ...
CSS基础入门，导入方式，选择器
CSS基础入门本博客为视频学习笔记原视频作者:狂神原视频地址:https://www.bilibili.com/video/BV1YJ411a7dy?p=2 1 了解CSS 1.1 如何学习cs ...
unity3d中画线有几种方式_Spring RestTemplate中几种常见的请求方式
原文 https://segmentfault.com/a/1190000011093597 在Spring Cloud中服务的发现与消费一文中,当我们从服务消费端去调用服务提供者的服务的时候,使用了 ...

HTML引入css样式的三种方式，css选择器的三种样式

文章目录

前言

一. css样式的三种方式

第一种：内联定义方式

第二种：样式块

第三种：引入外部独立css文件

二. 选择器的三种样式

第一种：id选择器

第二种：标签选择器

第三种：类选择器

三. css的绝对定位

HTML引入css样式的三种方式，css选择器的三种样式相关推荐

最新文章

热门文章

HTML引入css样式的三种方式，css选择器的三种样式

文章目录

前言

一. css样式的三种方式

第一种：内联定义方式

第二种： 样式块

第三种：引入外部独立css文件

二. 选择器的三种样式

第一种：id选择器

第二种：标签选择器

第三种：类选择器

三. css的绝对定位

HTML引入css样式的三种方式，css选择器的三种样式相关推荐

最新文章

热门文章

第二种：样式块