CSS的基本结构和用法

CSS是一种标识语言,用来向HTML文档添加各种样式。

基本结构

body{font-size:12px}

CSS样式一般包含两个部分,选择器和声明
选择器:告诉浏览器CSS样式将作用域网页中的那些对象,它可以是某个标签,指定的ID或Class值。浏览器在解析这些样式时会根据选择器来渲染对象显示的效果,选择器也可以称为选择符在大括号前面。
样式分隔符:将选择器,和具体样式分隔开,方便以块状显示指定对象的样式
声明:声明用来命令浏览器以和中效果去渲染选择器指定的对象,它可以有一个或无数个。它由属性和属性值组成
属性:CSS中设置好的样式选项,属性名由一个或多个字母组成,多个字母之间用连字符相连
属性值:用来定义显示效果的参数,可以是数值加单位或者规定的关键字

使用方法

行内样式

直接在各个HTML元素中添加style属性来添加样式,这种方法叫做行内样式。
浏览器在解析标签时,会检测到包含的style属性,便会调用CSS引擎来解析这些标签
除非要设置某个特定的样式时使用,其他时候不建议使用

<p style='font-size:25px'>长安回望绣成堆,山顶千门次第开。
一骑红尘妃子笑,无人知是荔枝来。</p>

内部样式

通过style元素指定CSS样式,该元素告诉浏览器元素的内容是CSS的源代码,当浏览器遇到该元素之后会调用CSS引擎区解析它。
在多个页面中使用会造成样式难以管理的难题,所以不经常使用。会用于表示一个页面所独有的样式。

	<style>p{color: red;}</style>

外部样式

通过link元素导入外部样式表。这样可以解决多个网页造成CSS样式冗余,便于样式管理

<link rel="stylesheet" type="text/css" href="1.css">

CSS注释

/*注释*/

用于添加一些中文注释,方便管理。

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

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

相关文章

宇宙采集器 淘宝商家电话采集爬虫分享

要编写一个访问淘宝商城店铺的程序&#xff0c;你可以使用Python编程语言和Selenium库来实现。 首先&#xff0c;确保你已经安装了Python和Selenium库。你可以使用pip命令来安装Selenium库&#xff1a; pip install selenium然后&#xff0c;你需要下载并安装Chrome浏览器&am…

ES中文检索须知:分词器与中文分词器

ElasticSearch (es)的核心功能即为数据检索&#xff0c;常被用来构建内部搜索引擎或者实现大规模数据在推荐召回流程中的粗排过程。 ES分词 分词即为将doc通过Analyzer切分成一个一个Term&#xff08;关键字&#xff09;&#xff0c;es分词在索引构建和数据检索时均有体现&…

【力扣 Hot100 | 第六天】4.21(最长连续序列)

文章目录 10.最长连续序列10.1题目10.2解法&#xff1a;哈希法10.2.1哈希思路10.2.2代码实现 10.最长连续序列 10.1题目 给定一个未排序的整数数组 nums &#xff0c;找出数字连续的最长序列&#xff08;不要求序列元素在原数组中连续&#xff09;的长度。 请你设计并实现时…

npm包管理器

npm&#xff08;Node Package Manager&#xff09;是Node.js的包管理器&#xff0c;用于安、发布和管理JavaScript模块。它是世界上最大的开源软件注册表&#xff0c;拥有超过100万个包供开发者使用。 使用npm可以轻松地安装和管理项目所需的各种模块。下面是npm包管理器的一些…

葡萄书--关系图卷积神经网络

异质图和知识图谱 同质图与异质图 同质图指的是图中的节点类型和关系类型都仅有一种 异质图是指图中的节点类型或关系类型多于一种 知识图谱 知识图谱包含实体和实体之间的关系&#xff0c;并以三元组的形式存储&#xff08;<头实体, 关系, 尾实体>&#xff0c;即异…

Python 全栈安全(二)

原文&#xff1a;annas-archive.org/md5/712ab41a4ed6036d0e8214d788514d6b 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 第二部分&#xff1a;认证与授权 本书的第二部分是最具商业价值的部分。我这样说是因为它充满了大多数系统需要具备的实用工作流示例&#xf…

Python 全栈安全(四)

原文&#xff1a;annas-archive.org/md5/712ab41a4ed6036d0e8214d788514d6b 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 第十五章&#xff1a;内容安全策略 本章涵盖 使用 fetch、navigation 和 document 指令编写内容安全策略 使用 django-csp 部署 CSP 使用报…

Redis 内存策略

目录 1. key到期的情况 Redis的内存结构redisDb Redis怎么知道哪个key过期的 Redis对过期key的删除策略 惰性删除 周期删除 2. key未到期&#xff0c;但内存使用已达上限的情况 Redis检查内存阈值的时刻 达到内存上限&#xff0c;Redis淘汰key的策略 结构体redisObj…

【测试】Kali Linux 渗透安全学习笔记(4) - 单一服务器扫描

距离上次做 Kali Linux 分享已经相隔半年之久了&#xff0c;刚好需要主导公司每半年一次的本地安全加固工作&#xff0c;这次将简单分享自己是如何做单一服务器的扫描。 声明&#xff1a; 本文测试的站点为自家站点仅做学习使用&#xff0c;不存在侵犯网络信息安全问题&#…

【C语言】——内存函数的使用及模拟实现

【C语言】——内存函数的使用及模拟实现 前言一、 m e m c p y memcpy memcpy 函数1.1、函数功能&#xff08;1&#xff09;函数名理解&#xff08;2&#xff09;函数介绍 1.2、函数的使用1.3、函数的模拟实现 二、 m e m m o v e memmove memmove 函数2.1、函数功能2.2、函数的…

HarmonyOS开发环境搭建 移动开发 鸿蒙开发 ArkTS

&#x1f4dc;目录 &#x1f4a1; 环境搭建 &#x1f680;安装nodejs &#x1f935;安装ohpm &#x1f354;安装SDK &#x1f4a5;Emulator安装 &#x1f336;️新建ArkTs项目 &#x1f3c6;️ArkTS语言 ✨️基本语法 &#x1f388; 声明式UI描述 &#x1f371;组件 …

java的单元测试和反射

单元测试 就是针对最小的功能单元&#xff0c;编写测试代码对其进行正确性测试 Junit单元测试框架&#xff1a; 可以用来对方法进行测试 有点&#xff1a; 可以灵活的编写测试代码&#xff0c;可以针对某个方法进行测试&#xff0c;也支持一键完成对全部方法的自动发测试&a…

理解JMM

JMM 对volatile的理解 volatile 是java虚拟机提供轻量级的同步机制 1、保证可见性 2、不保证原子性 3、禁止指令重排 那么可见性与JMM相关 什么是JMM Java内存模型&#xff0c;不存在的东西&#xff0c;是一个概念&#xff0c;是一个约定 线程加锁前&#xff0c;必须读取…

uni-app 如何添加模拟器

uni-app 如何添加模拟器 使用微信开发者工具运行微信小程序使用 HBuilderX 内置模拟器使用第三方 Android 模拟器 下载并安装&#xff1a;配置环境&#xff1a;连接模拟器&#xff1a; 总结 有哪些可以使用的安卓模拟器软件 uni-app 如何添加模拟器 Uni-App 是一个基于 Vue.js…

认知觉醒 PDF电子版 下载

认知觉醒 PDF电子版 开启自我改变的原动力 周岭 / 人民邮电出版社 / 2020-10 链接&#xff1a;https://pan.baidu.com/s/1EHUK_AhvE5TWAZsYXFQ5QA?pwdwrho 提取码&#xff1a;wrho

基于IIoT的设备预测性维护设计

基于IIoT的设备预测性维护设计 一、引言 在工业物联网&#xff08;IIoT&#xff09;的背景下&#xff0c;设备预测性维护成为了一种关键的战略&#xff0c;能够帮助企业提前发现并解决设备故障&#xff0c;从而提高生产效率、减少停机时间&#xff0c;并降低总体维护成本。为了…

uniapp 如何区分目前运行环境(app、web、mp-weixin)

platform 区分 iOS、Android uniplatform 区分 app、web、mp-weixin ....

Stable Diffusion,controlnet扩展

stable-diffusion-webui,GitHub地址&#xff1a; ControlNet-v1-1 版本模型下载&#xff1a; lllyasviel/ControlNet-v1-1 at main (huggingface.co) ControlNet-v1-1版本&#xff0c;GitHub地址&#xff1a; GitHub - lllyasviel/ControlNet-v1-1-nightly: Nightly releas…

前端实现以及个人理解

前言 这回从前端文本基础实现讲解开始&#xff0c;到前端本人使用过的一些框架进行简单说明&#xff0c;技术方面不会深讲&#xff0c;工作经验没多少&#xff0c;主要还不是固定一个方向深耕&#xff0c;本人一直觉得很慌&#xff0c;虽说领导给定的方向是全栈&#xff0c;但还…

控制maven 输出信息的语言

设置javac 输出 set JAVA_TOOL_OPTIONS-Duser.languageen JAVA_TOOL_OPTIONS-Duser.languageen 如果用java/java.exe来启动JVM&#xff0c;那么在命令行上使用 -Duser.countryUS 就可以把国家指定为美国。用javac/javac.exe来启动javac编译器则需要再多加个-J在前面&#xff0…