CSS:层叠样式表

可以将css样式编写到元素的style属性当中:

1.将样式直接写到style属性中,这种样式我们称为内联样式,内联样式只对当前的元素中的内容起作用,内联样式不方便复用,不推荐使用。
eg:

<p style="color:blue;font-size: 50px;">明月几时有,把酒问青天!</p>

2.也可以将CSS样式编写到head中的style标签里,叫做内部样式。
将样式表编写到style标签中,然后通过CSS选择器选中指定元素

<head><style type="text/css">p{color:green;font-size:40px;}</style>
</head>
<body><p>明月几时有,把酒问青天!</p>
</body>

3.还可以将样式表编写到外部的CSS文件中,然后通过link标签将外部的CSS文件引入到当前的页面中,href设置外部css文件的相对路径,使结构和表现完全分离。

<link rel="stylesheet" href="css/style.css" />

其他:
在CSS中,祖先元素的样式,也会被他的后代元素所继承;利用继承关系,可以将一些基本样式设置给祖先元素,这样所有的后代元素将会自动继承这些样式;
但是并不是所有的样式都会被子元素所继承。比如:背景相关的样式都不会被继承。
eg:

<!DOCTYPE html>
<html>
<head><style type="text/css">body{font-size: 25px;}</style>
</head>
<body><p>明月几时有?</p><p class="p1">明月几时有?</p><p>明月几时有?</p><p>明月几时有?</p>
</body>
</html>

CSS设置style属性的3种方法相关推荐

  1. CSS设置元素隐藏的4种方法

    方法一 display:none <!DOCTYPE html> <html lang="en"> <head><meta charset ...

  2. h5学习笔记之css补充之遮盖特、光影、实现球体、设置随机颜色的3种方法

    一.遮盖特效 : mask:url() 这个属性是添加一个透明照片作为遮罩,是拥有图片的属性的 如代码: div{width:500px;height:500px;background:url(&qu ...

  3. CSS实现水平垂直的几种方法

    title: CSS实现水平垂直的几种方法 categories: CSS tags: - CSS - HTML - 面试题 date: 2021-09-11   在HTMl中分为块级元素和内联元素, ...

  4. CSS图片水平垂直居中的三种方法

    CSS图片水平垂直居中的三种方法 设置行高 使用定位和translate 使用弹性盒子 设置行高 我们知道img元素为行内快元素,所以首先设置图片元素的父元素里文字水平居中,行高与整体高度一致. 其次 ...

  5. html div 居中心,CSS实现DIV居中的三种方法

    下面给大家分享div居中的实现代码,具体代码如下所示: demo .div1{ width: 100px; height: 100px; border: 1px solid #000000;} .di ...

  6. calc ie支持_让IE6/IE7/IE8支持CSS3属性的8种方法介绍

    让IE6/IE7/IE8支持CSS3属性的8种方法介绍 发布时间:2013-09-23 10:43:06   作者:佚名   我要评论 IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现 ...

  7. html照片与照片之间的间隔,css设置图片之间的间隔的方法

    css设置图片之间的间隔的方法 发布时间:2021-01-05 09:32:24 来源:亿速云 阅读:116 作者:小新 这篇文章将为大家详细讲解有关css设置图片之间的间隔的方法,小编觉得挺实用的, ...

  8. 设置环境变量的三种方法【转载】

    文章目录 1 设置环境变量的三种方法 1.1 临时设置 1.2 当前用户的全局设置 1.3 所有用户的全局设置 2 测试当前环境变量 3 脚本解析 3.1 打开的文件如下: 3.2 脚本解析说明 3. ...

  9. php类3个属性是哪3种,PHP获取类私有属性的3种方法

    今天在推上看到一条获取php类私有属性的推文,感觉很有意思: 顺着推文联想,还有其他方式吗?经过自己的测试及网上答案,总结出三种方法: 1. 反射 反射可以获取类的详细信息,要获取私有属性的值,只需将 ...

最新文章

  1. shujufenxi:一季度中国人每天存700亿元!“报复性存款”能带来消费吗?
  2. 读入两个字符串java_编写一个Java应用程序,从键盘读取用户输入两个字符串,并重载3个strAdd函数...
  3. 1060. 爱丁顿数(25)
  4. 如何用python“优雅的”调用有道翻译?
  5. python 分类_Python数据类型分类
  6. Python全栈开发之2、运算符与基本数据结构
  7. BERT4Rec:当NLP王者BERT进军推荐领域
  8. docker镜像启动后端口号是多少_初识Docker
  9. system权限运行cmd
  10. [USACO13OPEN]Fuel Economy【贪心】
  11. MATLAB离散控制系统
  12. c程序设计第五版谭浩强课后答案 第四章习题答案
  13. 传苹果将采用:夏普IGZO技术面板量产
  14. ABP VNext学习日记30
  15. 数据安全能力成熟度模型DSMM----1、DSMM架构
  16. jvm内存区域之虚拟机栈、pc计数器、本地方法栈
  17. 机器人开发--设计范式
  18. Python中的Monkey Patching (猴子补丁)
  19. 由电能高频率变化使物质发生衰变的机器
  20. CFS调度器学习总结

热门文章

  1. 腾讯位置服务-个性化地图
  2. SpringCloud Alibaba Sentinel 熔断降级 - 程序配制方式实现
  3. screen 下 xterm 保证256色
  4. 【Django-Meeting系统】time.sleep()实现定时发邮件,并放在K8S服务器中-20220722
  5. 使用kindeditor插件报editor is not defined 问题
  6. 数据库管理系统(DBMS)的基础知识概要
  7. 简单Chrome脚本 自动跳过b站视频播放结束后的的充电鸣谢页面
  8. UE4 Level Variant
  9. mysql sql variant_使用 sql_variant 数据
  10. 学习笔记 css background 图片