【Web前端】CSS使用方法

最新推荐文章于 2024-08-02 18:01:26 发布

Cimoon_

最新推荐文章于 2024-08-02 18:01:26 发布

阅读量5.3k

点赞数 3

分类专栏： Web前端

本文链接：https://blog.csdn.net/Dawson_Ho/article/details/88696303

版权

Web前端专栏收录该内容

26 篇文章 6 订阅 ¥9.90 ¥99.00

订阅专栏

超级会员免费看

本文详述了CSS的基础语法，包括选择器和声明的构成，并介绍了将CSS插入HTML的三种方式：外部样式表、内部样式表和内联样式。同时，解释了多重样式时的层叠次序，即内联样式优先，接着是内部样式表和外部样式表，最后是浏览器默认样式。

摘要由CSDN通过智能技术生成

*本文主要介绍CSS的基础语法，以及插入到HTML中的方法，供遗忘时快速查阅。（本文内容结合W3C教程编写）

CSS基础语法

CSS规则由选择器和声明组成

选择器是要改变样式的HTML元素，也可以是表示多个元素的id或class；

声明是要改变的属性和属性值，以冒号隔开；声明之间用分号隔开

h1 {color:red; font-size:14px;}        /*改变h1元素的样式*/
.div {color:red; font-size:14px;}      /*改变class为div的所有元素的样式*/

CSS插入HTML

当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。插入样式表的方法有三种：

1、外部样式表

最常用的插入方法ÿ

了解本专栏

订阅专栏解锁全文

超级会员免费看

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Cimoon_

关注关注

3
点赞
踩
19

收藏

觉得还不错? 一键收藏
打赏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

订阅专栏

淘宝首页web前端课设（HTML+css+js）

06-10

本web前端课设主要用到html，css知识点和一些少量的js语言编写的轮播图。适合于大一、大二正在做课设的同学进行参考。(我的博客里有做成的效果图和每个模块的解说内容，没有了解的同学可以先去看看做成功的页面效果...

Web入门——css

qq_57357292的博客

05-27

1829

一、定义简单来说，css就是在html上的代码将在web界面上如何呈现出来。举个例子：如果不用css进行排版，仅仅用html文件代码，所生成的页面上会是如下这样，将内容依次向下排列。如果用上css进行样式排版，生成的网页将会让人看起来比较舒服，如下图：二、css的相关语法一条CSS样式规则由两个主要的部分构成：选择器，以{}包裹的一条或多条声明。如： /* 这是CSS的注释 */ /* 建议每条申明占一行 */ p{ color:red; text-align:center; /*

1 条评论您还未登录，请先登录后发表或查看评论

CSS的使用与方法

m0_58310590的博客

03-23

1422

CSS盒子模型是用来描述元素在页面布局中所占空间的模型。每个HTML元素被看作是一个矩形的盒子。这个盒子包括内容区域、内边距、边框和外边距四个部分。盒子模型并不仅仅是内容与边界的距离，而是包括了内容、内边距、边框和外边距，这些部分共同构成了一个元素在页面中所占据的空间。相对定位相对于标签原来的位置移动 relative绝对定位(常用)相对于已经定位过的父标签做移动，如果没有父标签那么就以body为父标签当你不知道页面其他标签的位置和参数，只给了你一个父标签的参数，让你基于该标签做定位。

web基础之CSS

最新发布

Yunzhong_jiuxiao的博客

08-02

1134

css属性

网页设计的css样式,网页设计引入CSS样式的五种方式_css

weixin_36058303的博客

08-04

2712

一、使用STYLE属性将STYLE属性直接加在个别的元件标签里，＜元件(标签) STYLE=”性质(属性)1: 设定值1; 性质(属性)2: 设定值2; …}例如：＜TD STYLE=”COLOR:BLUE; font-size:9pt; font-family:”标楷体”; line-height:150%＞这种用法的优点是可灵巧应用样式於各标签中，但是缺点则是没有整篇文件的『统一性』。二、使...

CSS使用方法

我爱编程持之以恒

05-07

1638

css就是规定各种显示风格样式的名称和设置值的规则。它有4种方式可以将样式加入到HTML中，分别是内联样式表、嵌入样式表、外联样式表、输入样式表。 ①内联样式表：在html标签中直接使用style属性。它适用于只需要将一些简单的样式应用于某个独立的元素的情况。在使用时，需要在head标签中添加meta标签，如下：使用方法如下： ②嵌入样式表：在

CSS的概述

qq_40208605的博客

04-04

2440

1.1CSS的概述1.1.1CSS是什么 CSS 通常称为CSS样式或层叠样式表，主要用于设置HTML页面中的文本内容（字体、大小、对其方式等）、图片的外形（高宽、边框样式、边距等）以及版面的布局等外观显示样式。 CSS可以是HTML页面更好看，CSS色系的搭配可以让用户更舒服，CSS+DIV布局更佳灵活，更容易绘制出用户需要的结构。 1.1.2CSS名词解释 CSS (Cascad...

Web前端网页期末大作业

01-10

主页设计布局是在网站的左上... 首先选定本网页制作工具是前端开发利器： WebStorm，创建前端项目工程，并创建相应的文件夹，存放各个css、js，还有网页中用到的各种图片放到pic文件夹中，背景音乐放到music文件夹中。

Web前端学习之CSS课件

01-21

WEB前端CSS居中的几种方法共4页.pdf.zip

10-30

以上是CSS实现Web前端元素居中的主要方法。在实际开发中，根据项目需求和浏览器兼容性选择适合的方法。随着现代浏览器对Flexbox和Grid布局的支持越来越广泛，这两种方法已经成为首选的居中解决方案。了解并熟练运用...

HTML5与CSS3web前端开发技术习题答案.pdf

01-07

### HTML5与CSS3 Web前端开发技术习题答案解析 #### 第一章 ##### 1.1 简答题 **（1）HTML5与HTML4比较，主要解决了哪些问题？** HTML5作为HTML4的升级版，在Web前端开发方面解决了一系列关键问题，主要体现在...

【web前端基础4】CSS样式基本用法

liao_sp的博客

03-27

471

CSS是Cascading Style Sheet的缩写，译为“层叠样式表”或“级联样式表”。CSS定义如何显示HTML的标签样式，用于设计网页的外观效果。通过使用CSS实现页面的内容与表现形式分离，极大地提高了工作效率。20世纪90年代初，HTML语言诞生。早期的HTML只含有少量的显示属性，用来设置网页和字体效果。

web基础篇-css

weixin_44803968的博客

06-28

1057

【代码】web基础篇-css。

web前端之CSS操作

浪漫的诗人博客

08-08

1098

对于短时间内连续触发的事件（滚动事件），让某个时间期限内，事件函数只执行一次。

web应用——CSS

m0_63596031的博客

01-18

1670

web应用，从HTML到CSS再到JS三件套，持续更新中！第二篇——CSS篇主要包含一些常用样式功能实现方法

【web前端开发】第二周 CSS的基本使用

Liu_y_xin的博客

03-30

950

行内式也称为内联样式，是通过标记的style属性来设置元素的样式，该语法中style是标记的属性，实际上任何HTML标记都拥有style属性，用来设置行内式。例如，定义主体元素body的文本颜色为黑色，那么页面中所有的文本都将显示为黑色，这是因为其他的标记都嵌套在标记中，是标记的子标记。所谓层叠性是指多种CSS样式的叠加。在上面的语法格式中，h-shadow用于设置水平阴影的距离，v-shadow用于设置垂直阴影的距离，blur用于设置模糊半径，color用于设置阴影颜色。

web应用开发学习——CSS利用

学习记录

03-02

863

一、学习内容充分理解并掌握CSS基本用法，了解四种CSS样式应用的方法，包括行内样式、内嵌式、链接式以及导入式。学习并应用与布局密切相关的技术，例如浮动技术和定位技术，以及display、block、inline、table、flex等属性。学习并应用table+css、div+css、html5布局，固定布局、流动布局与弹性布局。二、实验内容 1.创建一个新的HTML文档，获得一个完整的文档结构。 2.编写css文件定义HTML的显示样式。（1）设置网页整体高度、图片背景（2）利用元素选择器自

web前端教程，详解引入CSS的4种方式

weixin_54585403的博客

10-29

5771

我们在编写HTML文件的时候，为了使网页的内容和属性更加丰富，难免会引入CSS来达到我们的目的。CSS是一种用来表现HTML文件样式的计算机语言，仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。引入CSS有4 种方式，其中有2 种方式是在HTML文件中直接添加CSS代码，另外2种是引入外部 CSS文件。下面我们一起来学习一下引入CSS的4种方式，了解过的小伙伴也可以温故知新。 1.内联方式内联样式即只在某个元素内使用style属性，它只针对某个元素，而不会影响整个文件，所

Web前端CSS基础样式详解与实践

在Web前端开发中，CSS（层叠样式表）基础知识对于构建美观、功能丰富的网页至关重要。本文将带你深入理解CSS的基础样式，包括颜色的表示法、单位的选择、文本样式控制以及字体设置。 1. 颜色的表示： - CSS允许...