CSS样式三种形式
CSS基本表现形式只有三种:标签样式、Class类样式、ID样式
标签样式: 必须与HTML标签同名。仅仅影响同名标签
Class样式:可以在任何标签中使用: class="样式名"
ID: #来表示
优先级 ID > Class > Label
1: HTML (结构层) 2: CSS (表现层) 3: JavaScript (行为层) 的关系
1: HTML (结构层) 2: CSS (表现层) 3: JavaScript (行为层)
2: HTML类似人的骨骼, CSS就像人的皮肤,JS给人赋予生命。
3: 前端框架:BootStrap / Jquery (通过网页的dom对象类进行选择) / Vue、Angularjs (双向数据绑定)
代码:
前端技术介绍、样式三种形式
/* CSS基本表现形式只有三种:标签样式、Class类样式、ID样式
标签样式: 必须与HTML标签同名。仅仅影响同名标签
Class样式:可以在任何标签中使用: class="样式名"
ID: #来表示,优先级 ID > Class > Label
*/
div{
color: red;
}
.mycls{
color: green;
}
#mycls{
color: blue;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<!--
1: HTML (结构层) 2: CSS (表现层) 3: JavaScript (行为层)
2: HTML类似人的骨骼, CSS就像人的皮肤,JS给人赋予生命。
3: 前端框架:BootStrap / Jquery (通过网页的dom对象类进行选择) / Vue、Angularjs (双向数据绑定)
-->
<div>我是DIV标签</div>
<div class="mycls" >我是DIV标签,使用class定义CSS</div>
<p id="mycls">我是P段落 使用Id定义</p>
</body>
CSS样式三种形式的更多相关文章
- CSS样式三种形式222
markdown CSS基本表现形式只有三种:标签样式.Class类样式.ID样式 标签样式: 必须与HTML标签同名.仅仅影响同名标签 Class样式:可以在任何标签中使用: class=" ...
- 大家好,又是新的一天。今天给大家带来一些新的知识:选择器的种类和css的三种样式
今天我们为大家 选择了 六种 选择器: 1. 标签选择器 2.id选择器 3.class选择器 4.后代选择器 5.子代选择器 6.交集选择器 我们就举三个典型的例子:后代选择器,子代选择器和交集选择 ...
- HTML5结合CSS的三种方法+结合JS的三种方法
HTML5+CSS: HTML中应用CSS的三种方法 一.内联 内联样式通过style属性直接套进HTML中去. 示例代码 <pstylepstyle="color:red" ...
- html(常用标签,标签分类),页面模板, CSS(css的三种引入方式),三种引入方式优先级
HTML 标记语言为非编程语言负责完成页面的结构 组成: 标签:被<>包裹的由字母开头,可以结合合法字符( -|数字 ),能被浏览器解析的特殊符号,标签有头有尾 指令:被<>包 ...
- css-1,css的三种引入方式 基本选择器
<!-- (1)CSS 层叠样式表 作用:修饰网页结构 (2)css的三种引入方式 权重: 优先级高 权重大 谁在页面谁的权重大 - 行内样式 注意:行内样式的优先级是最高的 - 内接样式 - ...
- 11 CSS的三种引入方式和基本选择器
<!-- 整体说明: 1.CSS的三种引入方式 (1)行内样式 (2)内接样式 (3)外接样式 2.CSS的基本选择器 (1)id选择器 (引用方式:#id) (2)标签选择器(引用方式:标签名 ...
- Html CSS的三种链接方式
感谢原文:https://blog.csdn.net/abc5382334/article/details/24260817 感谢原文:https://blog.csdn.net/jiaqingge/ ...
- Qt学习 之 多线程程序设计(QT通过三种形式提供了对线程的支持)
QT通过三种形式提供了对线程的支持.它们分别是, 一.平台无关的线程类 二.线程安全的事件投递 三.跨线程的信号-槽连接. 这使得开发轻巧的多线程Qt程序更为容易,并能充分利用多处理器机器的优势.多线 ...
- spring对事务支持的三种形式
spring对事务支持的三种形式: 1.通过spring配置文件进行切面配置 <bean id="***Manager" class="org.springfram ...
随机推荐
- Linux 搜索查找类指令
一.find 指令 find 指令将从指定目录向下递归遍历其各子目录,将满足条件的文件或者目录显示在终端. 基本语法 find [搜索范围] [选项] 选项说明 -name ...
- 和小哥哥一起刷洛谷(4) 图论之广度优先搜索BFS
关于bfs: 你怎么会连这个都不知道!!!自己好好谷歌一下!!!(其实我也刚学) bfs伪代码: while(队列非空){ 取出队首元素u; 弹出队首元素; u染色为黑色; for(int i=0;i ...
- ES6——class类继承(读书笔记)
前言 我一定是一个傻子,昨天这篇文章其实我已经写好了一半了,但是我没有保存 这是学习ES6的过程,我没有系统的看完阮大大的书.零零散散的,很多功能知道,但是没有实际的用过 看了几遍,总是看前面几章,所 ...
- Python在windows平台的多版本配置
Python在windows平台的多版本配置 快速阅读: python在windows平台的环境变量以及多版本配置 ,以及pycharm如何安装包,以及安装包出错时如何排查. 1.python环境 ...
- 免费s账号网站
下面网址按排序顺序优先使用,数字越小优先级越高 1,https://io.freess.today/ 2,https://free-ss.site/ 3,https://ss.freess.org/ ...
- MQTT教學(一):認識MQTT
http://swf.com.tw/?p=1002 本系列文章旨在補充<超圖解物聯網IoT實作入門>,採用Arduino.ESP8266和Node.js實作MQTT物聯網通訊實驗. MQT ...
- Visual Studio 2019更新到16.1.6
Visual Studio 2019更新到16.1.6 此次更新主要是修复几个安全漏洞,如CVE-2019-1077(VS自动更新漏洞).CVE-2019-1075(ASP.net Core欺骗漏洞) ...
- 解决IE浏览器没有网络的情况
计算机能够连接到网络,但是IE浏览器却显示没有网络. 解决方案: 设置 >> IE internet选项: 选择“高级”: 选择“重置”: 勾选“删除个人设置”,点击重置: 重新打开IE, ...
- sqllite 学习-1
C# SQLite 数据库操作学习: https://www.cnblogs.com/leemano/p/6578050.html SQLite 之 C#版 System.Data.SQLite 使用 ...
- SQLite数据库数据类型详解
数据类型 类型 描 述 bit 整型 bit 数据类型是整型,其值只能是0.1或空值.这种数据类型用于存储只有两种可能值的数据,如Yes 或No.True 或Fa lse .O ...