html5——CSS3基础

目录

CSS概念

CSS3基本语法

HTML中引入CSS样式

1、行内样式

2、内部样式

3、链接样式


CSS概念

表现HTML或XHTML文件样式的计算机语言

· 包括对字体、颜色、边距、高度、宽度、背景图片、网页定位等设定

CSS3基本语法

选择器**{声明1;**

声明****2;

...... }

**CSS的最后一条声明后的";"可写可不写,但是,基于W3C标准规范考虑,建议最后一条声明的结束";****"**都要写上

HTML中引入CSS样式

  1. 行内样式
  2. 内部样式
  3. 链接样式

1、行内样式

使用style属性引入CSS样式

<pstyle="color: red;font-size: 36px;">人之初,性本善。</p>

2、内部样式

CSS代码写在<head>内的<style>标签中
<style>

h1{color: green; }

</style>

优点

方便在同页面中修改样式

缺点

不利于在多页面间共享复用代码及维护,对内容与样式的分离也不够彻底

3、链接样式

CSS代码保存在扩展名为.css的样式表中

<head>

......

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

......

</head>

CSS3样式优先级:

  1. 行内样式>内部样式>链接样式
  2. 就近原则**:越接近标签的样式优先级越高**
相关推荐
雾岛听风69114 小时前
JavaScript基础语法速查手册
开发语言·前端·javascript
遇见~未来14 小时前
第三篇_现代布局_从弹性到网格
前端·css3
前端那点事14 小时前
Vue前端SEO优化全攻略(实操落地版,新手也能上手)
前端·vue.js
Dxy123931021614 小时前
HTML 如何使用 SVG 画曲线
前端·算法·html
时光之源14 小时前
Visual Studio | Marketplace创建发布者(Create Publisher)时无法创建的问题解决方案
ide·vscode·visual studio·plugin·cursor
用户23678298016814 小时前
从零实现 GIF 制作工具:LZW 压缩与 Median Cut 色彩量化
前端·javascript
hahaha 1hhh14 小时前
中文乱码 ubuntu autodl
linux·运维·前端
棉猴14 小时前
Python海龟绘图之绘制文本
javascript·python·html·write·turtle·海龟绘图·输出文本
Aray123414 小时前
VS Code 中使用 Claude Code 调用 GPUStack 本地大模型及 ECC 安装教程
vscode·ecc·gpustack·claude code
Codebee14 小时前
Harness Engineering:AICode 的灵魂
前端·人工智能·前端框架