html设置样式不继承_web前端入门到实战:css的核心原理分为优先级原则与继承原则两大部分...

60d471b0640516aeadada5a80807c22e.png

css原理:1.优先原则=>后解析的内容会覆盖之前解析的内容(所谓解析就是读取的css样式)2.继承原则=>嵌套里面的标签拥有外部标签的某些样式,子元素可以继承父元素的属性

1》优先原则针对选择器:a.同一个选择器从上往下读取执行css样式 b.同一类选择器从上往下执行 c.不同类型的选择器优先级,先执行低优先级再执行高优先级,比方基本选择器就是从*通配符<标签div<class选择器<id选择器 d.外部样式与内部样式合并之后再一起执行,根据从上往下执行顺序读取 e.内联样式也就是行内样式是最后执行的 f.加了!important字段是最后执行的

2》继承原则:2.1跟文字样式相关的可以被继承/其他的不能继承 2.2块级元素的宽度如果不设置会继承父元素的宽度,高度取决于它的内容

 1 <!DOCTYPE html>2 <html lang="en">3 <head>4     <meta charset="UTF-8">5     <meta name="viewport" content="width=device-width, initial-scale=1.0">6     <title>css的核心原理分为优先级原则与继承原则两大部分</title>7     <!-- 优先原则针对选择器:a.同一个选择器从上往下读取执行css样式 8         b.同一类选择器从上往下执行 c.不同类型的选择器优先级,先执行低优先级再执行高优先级,比方基本选择器就是从*通配符<标签div<class选择器<id选择器 9 d.外部样式与内部样式合并之后再一起执行,根据从上往下执行顺序读取 e.内联样式也就是行内样式是最后执行的 f.加了!important字段是最后执行的 -->
10     <style type="text/css">
11     div{
12         /* color:#f90; */
13         color:#f90 !important;
14     }
15     /* div{ 16 color:red; 17 } 18 .box1{ 19 color: yellowgreen; 20 } 21 #box2{ 22 color: violet; 23 } */
24     </style>
25     <link rel="stylesheet" href="demo2.css"><!--新建demo2.css,文件内容div{color: blue;}-->
26 </head>
27 <body>
28     <!-- <div class="box1" id="box2">我想起那天下午在夕阳下的奔跑,那是我逝去的青春</div> -->
29     <div style="color: skyblue;">我想起那天下午在夕阳下的奔跑,那是我逝去的青春</div>
30 </body>
31 </html>

从最零基础开始的的HTML+CSS+JavaScript。jQuery,Ajax,node,angular框架等到移动端HTML5的项目实战【视频+工具+系统路线图】都有整理,在线解析,学习指导,点:【WEB前端学习圈⑤】

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/301413.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

开源 免费 java CMS - FreeCMS1.3-数据对象-mail

2019独角兽企业重金招聘Python工程师标准>>> 下载地址&#xff1a;http://code.google.com/p/freecms/ mail 从FreeCMS 1.2 开始支持 在使用互动信件相关标签时&#xff0c;标签会封装mail供页面调用。 属性 说明 id id unitid 收信单位id …

3dmax导出x文件插件2020_C4D与unity3D,3DMAX,AI,AE,ks之间互导

一&#xff0c;C4D与unity3D互导C4D——unity3DC4D导入unity3D遇到的各种问题1.在C4D里挤压的模型转换为可编辑对象了&#xff0c;但是导入Unity以后&#xff0c;模型的封顶没了&#xff1f;2.导入到Unity中发现在里面查看模型丢面和少模型的问题&#xff0c;而且素材也少了好多…

128位计算机 ps2,64位就是最强电脑?难道就没有128位的电脑吗

知道两个系统版本的不同&#xff0c;很多软件是不能通用的。还记得几年前内存价格下降&#xff0c;很多朋友都升级了大的内存&#xff0c;而有的玩家安装内存之后发现32位的系统不支持3.25G以上的内存&#xff0c;也让一些玩家耿耿于怀&#xff0c;网上出现了很多让32位系统支持…

还在为孩子学不好数学而犯愁?你想要知道的或许在这!

▲数据汪特别推荐点击上图进入玩酷屋记得寒假时&#xff0c;超模君七岁小表弟来问了我一道题目&#xff1a;下面线段有多少条&#xff1f;首先我问了他什么是线段&#xff1f;他说&#xff1a;两端有端点&#xff0c;不可以伸长的直线。AB就是线段。我慢慢引导&#xff0c;假如…

ddr4服务器内存频率_镁光出样DDR5内存;紫光发布P5160系列SSD!

今 日 资 讯 1镁光出样DDR5内存2020年AMD、Intel即将推出的新一代CPU处理器还会支持DDR4内存&#xff0c;但是下一代DDR5内存已经近在眼前&#xff0c;2021年就会正式上市。近日镁光宣布开始向客户出样最新的DDR5内存&#xff0c;基于1Znm工艺&#xff0c;性能提升了…

数据时代,信息的无处遁形

从数据中抽取信息从信息中挖掘知识随着大数据时代的到来&#xff0c;数据挖掘的重要性越发显著。可谓是兵马未至&#xff0c;数据先行。所谓数据挖掘&#xff0c;一般是指从大型数据库中将隐藏的预测信息抽取出来的过程&#xff0c;而更为精确的解释就是“从数据中挖掘知识”。…

dw自动滚动图片_3分钟搞定图片懒加载

什么是图片懒加载图片的懒加载就是在页面打开的时候&#xff0c;不要一次性全部显示页面所有的图片&#xff0c;而是只显示当前视口内的图片&#xff0c;一般在移动端使用&#xff08;PC端主要是前端分页或者后端分页&#xff09;。为什么需要懒加载对于一个页面加载速度影响最…

获利40多万,工地技术员自学开发外挂被抓

全世界只有3.14 % 的人关注了数据与算法之美今年年初&#xff0c;江苏省公安厅召开新闻发布会&#xff0c;通报全省公安机关开展“净网”专项行动战果。随后平安江苏 在微博中公布了多个案件&#xff0c;其中有个涉及利用技术定位侵犯公民个人信息的案件。【案发】欠债老板在吃…

使用C#在VS Code中编写Notebook

提到大名鼎鼎的Jupyter Notebook&#xff0c;大家应该都听说过。它是基于网页的用于交互计算的应用程序。其可被应用于全过程计算&#xff1a;开发、文档编写、运行代码和展示结果。但是Jupyter Notebook需要使用Python编写代码&#xff0c;对.Neter不太友好。不过&#xff0c;…

显卡mx150和230哪个好_建模渲染用专业图形显卡和游戏显卡哪个更好?

最近很多朋友让小杨写配置单顺带装机&#xff0c;70%的用户是游戏需求&#xff0c;20%的是设计需求&#xff0c;为数不多的是办公需求&#xff0c;那么问题来了&#xff0c;建模渲染用专业图形显卡和游戏显卡哪个更好&#xff1f;下面小杨给大家深度剖析一番。(建模渲染)今天小…

计算机录取高考生过程,解密高考录取过程:人机结合 打造“阳光高招”

考生的档案怎么被投到志愿高校?每个院校的录取分数线怎么划定?哪些学生容易被退档?15日下午&#xff0c;记者随部分省人大代表探访设在大学城的高招录取现场&#xff0c;为您详解高招录取关键环节。先来看下文史、理工类本一批次实行的按院校平行志愿的网上录取的大致流程&a…

每日一笑 | 如果把大脑看成CPU的话...

全世界只有3.14 % 的人关注了数据与算法之美&#xff08;图片来源于网络&#xff0c;侵权删&#xff09;

C# 三种方式实现Socket数据接收(经典)

Stream.Read 方法当在派生类中重写时&#xff0c;从当前流读取字节序列&#xff0c;并将此流中的位置提升读取的字节数。语法&#xff1a;public abstract int Read(byte[] buffer, int offset, int count)参数&#xff1a;buffer: 字节数组。此方法返回时&#xff0c;该缓冲区…

服务器运维监控指标,运维体系~指标监控~Prometheus监控告警与日志

一 Prometheus 入门1.1 入门介绍运维体系~指标监控先来一张图&#xff0c;说明一下Prometheus监控相关的软件和知识点。1: 首先要安装&#xff1a;Prometheus, 负责收集各种监控指标&#xff0c;也包括自己定监控2: 接着安装Grafana全面瓦解,负责展示监控指标3&#xff1a;接着…

限时秒杀┃月销10000+件,风靡全国的steam科学实验套装

▲数据汪特别推荐点击上图进入玩酷屋之前小木有推荐过“彩虹实验”&#xff0c;这款是可以让孩子在探索中能够独立思考&#xff0c;主动地构建知识库&#xff0c;培养创造力。&#xff08;传送门&#xff09;让孩子们在家开展科学游戏&#xff0c;既能提升动手能力&#xff0c;…

面向.NET开发人员的Dapr——入门

目录&#xff1a;面向.NET开发人员的Dapr——前言面向.NET开发人员的Dapr——分布式世界面向.NET开发人员的Dapr——俯瞰DaprGet started with DaprDapr 入门In the first two chapters, you learned basic concepts about Dapr. Its time to take it for a test drive. This c…

比乐高还要好玩,50种奇妙装置玩法,将STEM教育一网打尽

▲数据汪特别推荐点击上图进入玩酷屋致砖《小小机器人》套装全新首发电动机械的完美结合先来看看视频过过眼瘾吧来自美国STEAM教育让孩子跨学科学知识积木向来是STEAM教育很重要的一部分&#xff0c;因为它涉及到了多种学科&#xff1a;要搭建得稳固——这是工程学&#xff1b;…

capslock键英语怎么读_刚开始读英文原版书该怎么做?商务英语专业有前途吗?...

是的&#xff0c;看我的朋友圈也能学英文#26从最近的朋友圈和微博中选了一些内容&#xff0c;分享给大家。1. 如何开始读英文原版书&#xff1f;关于读英文原版书&#xff0c;我给出一个简单粗暴的开始和进阶方案。启动方案&#xff1a;首先找一本你特别感兴趣的书&#xff0c;…

【12图】你管这破玩意叫Pulsar

这两年pulsar发展比较快&#xff0c;有好多大公司引入了pulsar&#xff0c;相关的资料和课程也多了&#xff0c;今天一起来了解一下pulsar这款中间件。下图是几款消息中间件的历史&#xff1a;2012年pulsar在Yahoo内部开发&#xff0c;2016年开源并捐献给Apache&#xff0c;201…

每日一笑 | 为什么英语老师让我们养成背单词的习惯?

全世界只有3.14 % 的人关注了数据与算法之美&#xff08;图片来源于网络&#xff0c;侵权删&#xff09;