【CSS】CSS基础1(CSS基本介绍+常见样式设计)

目录

什么是CSS? 

语法规范

常见样式

例子

代码展示


什么是CSS? 

点击以下链接了解更多:

​​​​​​​ ​​​​​icon-default.png?t=N7T8https://baike.baidu.com/item/%E5%B1%82%E5%8F%A0%E6%A0%B7%E5%BC%8F%E8%A1%A8/524980?fromModule=lemma_inlink(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化

语法规范

选择器 {属性: 值    属性: 值 }

                |

                | 

                \/

                声明

h1 { color: red;  font-size: 25px; }

常见样式

注:属性值只是一个案例,并不是只能是那种

常见样式
字体颜色color:red
背景颜色background-color:red
字体大小font-size:50px
字体粗细font-weight: lighter(变细)
字体样式font-style:italic(斜体)
文本装饰text-decora:underline(下划线)
文字对齐方式text-align:center(中间对齐)

例子

代码展示

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title></title>
		<style type="text/css">
			p{
				color: aqua;
				background-color: pink;
			}
			span{
				font-size: 50px;
				text-decoration: underline;
			}
			div
			{
				font-style: initial;
				font-weight: bold;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<p>
			哈哈哈哈哈哈哈哈哈哈哈
			哈哈哈哈哈哈哈哈哈哈哈
			
		</p>
		<span>
			哈哈哈哈哈哈哈哈哈哈哈
		</span>
		<div>
			哈哈哈哈哈哈哈哈哈哈哈
		</div>
		
	</body>
</html>


今天的分享到这里就结束啦~希望能帮到您!!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

ADW300多功能无线计量仪表

仪表应用背景 电力运维行业&#xff1a;运维服务系统实时采集大量用户站的运行和动环数据&#xff0c;经专业数据分析&#xff0c;当用户站发生异常情况或运行故障时&#xff0c;及时反馈到运维指挥中心&#xff0c;并通过移动终端通知相应的运维工程师&#xff0c;指导现场作…

Linux Networking - MTU

MTU MTU&#xff0c;Maximum Transmission Unit&#xff0c;指的是Ethernet Frame的Payload部分的长度限制&#xff0c;如下图&#xff1a; 1500这个数字则有一定的历史原因&#xff0c; 参考链接&#xff1a; How 1500 bytes became the MTU of the internethttps://blog.b…

指针知识大礼包,让你的编程之路更顺畅(二)

1. 数组名的理解 2. 使⽤指针访问数组 3. ⼀维数组传参的本质 4. ⼆级指针 5. 指针数组 6. 指针数组模拟⼆维数 正文开始&#xff1a; 1. 数组名的理解 在上⼀个章节我们在使⽤指针访问数组的内容时&#xff0c;有这样的代码&#xff1a; int arr[10] {1,2,3,4,5,6,7,…

启动性能优化

一、应用启动慢的原因 1.在主线程执行了太多耗时的操作&#xff0c;比如加载数据&#xff0c;或者初始化三方库等等&#xff0c;导致在Application的oncreate或者Activity的oncreate方法中耗时太久 2.布局嵌套太深&#xff0c;或者一些不会立即使用的布局也在一开始一起加载到…

Jira 软件缺陷管理 (软件测试)

内容来源&#xff1a;总结黑马课程 1.软件缺陷信息 2.创建缺陷问题 2.1 缺陷模板 2.2 创建缺陷问题模板

3.25作业

定义自己的命名空间&#xff0c;其中有string类型的变量&#xff0c;再定义两个函数&#xff0c;一个函数完成字符串的输入&#xff0c;一个函数完成求字符串长度&#xff0c;再定义一个全局函数完成对该字符串的反转有以下定义&#xff0c;说明哪些量可以改变哪些不可以改变&a…

【C】盛最多水的容器(双指针)

盛最多水的容器 原题目链接:点击跳转 给定一个长度为 n 的整数数组 height 。有 n 条垂线&#xff0c;第 i 条线的两个端点是 (i, 0) 和(i, height[i]) 。 找出其中的两条线&#xff0c;使得它们与 x 轴共同构成的容器可以容纳最多的水。 返回容器可以储存的最大水量。 说…

【3D reconstruction 学习笔记 第二部】

三维重建 3D reconstruction 4. 三维重建与极几何三角化&#xff08;线性解法&#xff09;三角化&#xff08;非线性解法&#xff09;多视图几何极几何极几何约束基础矩阵估计 5. 双目立体视觉重建6. 多视图重建7. SFM 系统设计8. SLAM系统设计 4. 三维重建与极几何 三角化&…

微信SEO秘籍:6年经验,祝你轻松引流获客

我 17 年前就已经开始研究微信 SEO&#xff0c;并逐步完善成系统的教程&#xff0c;可以说是国内最早的微信 SEO 课程。至今&#xff0c;我已连续教授了 6 年&#xff01; 我自己也一直亲自操作&#xff0c;不断优化和升级我的课程&#xff0c;我的许多学员通过学习我的微信 S…

嵌入式3-25

1、输入一个数&#xff0c;实现倒叙 123-->321 2、输入一个&#xff0c;判断是否是素数 3、输入一个文件名&#xff0c;判断是否在家目录下存在&#xff0c;如果是一个目录&#xff0c;则直接输出是目录下的.sh文件的个数。如果存在则判断是否是一个普通文件&#xff0c;如果…

nba官网详情wasm逆向 第二部分

声明: 本文章中所有内容仅供学习交流使用&#xff0c;不用于其他任何目的&#xff0c;抓包内容、敏感网址、数据接口等均已做脱敏处理&#xff0c;严禁用于商业用途和非法用途&#xff0c;否则由此产生的一切后果均与作者无关&#xff01;wx a15018601872 本文章…

Orangedx:引领新一轮 BTCFi 浪潮

“OrangeDx 作为新一轮 BTCFi 浪潮引领者被市场寄予厚望 &#xff0c;前不久在 FinceptorApp 的平台的公开销售 20 万美元的额度仅在几秒售罄&#xff0c;而其即将以 Startup 方式登陆 Gate 平台也同样备受市场期待。” 自 Ordinals 面向市场为比特币生态带来全新的资产发行方案…

QT常见Layout布局器使用

布局简介 为什么要布局&#xff1f;通过布局拖动不影响鼠标拖动窗口的效果等优点.QT设计器布局比较固定&#xff0c;不方便后期修改和维护&#xff1b;在Qt里面布局分为四个大类 &#xff1a; 盒子布局&#xff1a;QBoxLayout 网格布局&#xff1a;QGridLayout 表单布局&am…

16:00面试,16:06就出来了,问的问题有点变态。。。

从小厂出来&#xff0c;没想到在另一家公司又寄了。 到这家公司开始上班&#xff0c;加班是每天必不可少的&#xff0c;看在钱给的比较多的份上&#xff0c;就不太计较了。没想到8月一纸通知&#xff0c;所有人不准加班&#xff0c;加班费不仅没有了&#xff0c;薪资还要降40%…

电饭煲/电磁炉/空调/机顶盒显示驱动芯片特点与相关型号推荐

电饭煲、电磁炉、空调和机顶盒等家用电器通常都包括数码管或LED显示&#xff0c;用于显示时间、温度、设置等信息。这些芯片通常具有多位数码管或LED的支持、亮度控制、多种字符和符号的显示、低功耗设计等功能。 电饭煲、电磁炉、空调和机顶盒等家用电器的显示驱动芯片通常是…

后端常问面经之计算机网络

一台机器理论上能创建多少条TCP连接&#xff1f; Linux每维护一条TCP连接都要花费内存资源的&#xff0c;每一条静止状态&#xff08;不发送数据和不接收数据&#xff09;的 TCP 连接大约需要吃 3.44K 的内存&#xff0c;那么 8 GB 物理内存的服务器&#xff0c;最大能支持的 …

Win11 安装docker 及 WSL2 并更新安装位置及迁移

1 下载并安装运行 Docker Desktop 1.1 下载 Docker Desktop 点击链接下载 Docker Desktop&#xff1a;https://desktop.docker.com/win/main/amd64/Docker%20Desktop%20Installer.exe 下载后得到&#xff1a; 1.2 通过命令行安装 Docker Desktop 在 Docker Desktop Install…

【HDFS】DatanodeAdminBackoffMonitor退役节点极慢的问题定位

一、现象: 下节点特别慢。10台节点,每台大约需要退役60w个块。但是3个小时才退役了3000多个块。 NN侧如下日志,可以看到30秒只退役了512-494 = 20个块,这要是退役600w个块,得猴年马月? 2024-03-19 14:44:42,952 INFO org.apache.hadoop.hdfs.server.blockmanagement.D…

计算机系统基础 4 寻址方式

对于一条指令&#xff0c;我们重点关注它两点&#xff1a;执行什么样的操作&#xff0c;操作数在哪里。 操作数存放的位置即为存放地址&#xff0c;一般是CPU内寄存器、主存、或者I/O设备端口。当操作数在主存时&#xff0c;我们重点关注段址/段选择符、段内偏移。 寻找操作数存…

RuoYi-Vue若依框架-代码生成器的使用

代码生成器 导入表 在系统工具内找到代码生成&#xff0c;点击导入&#xff0c;会显示数据库内未被导入的数据库表单&#xff0c;选择自己需要生成代码的表&#xff0c;友情提醒&#xff0c;第一次使用最好先导入一张表进行试水~ 预览 操作成功后可以点击预览查看效果&…