引入css(层叠样式表)文件的三种方法

最新推荐文章于 2024-07-17 22:52:51 发布
最新推荐文章于 2024-07-17 22:52:51 发布
阅读量550 收藏 3
点赞数 1
分类专栏： java web基础知识 文章标签： css 前端 引入css文件的三种方法
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/SSS4362/article/details/125398130
版权

引入css(层叠样式表)文件的三种方法

1.行内样式(标签里面)

书写的位置:标签的<>(尖括号)里面

<标签名 style="样式名:样式值1;样式2:样式值2"></标签名>

说明:这种主要用于极个别需要临时改样式的情况

​ 其中行内样式别称为行间样式

2.内部样式

书写的位置:head标签里面且位于title标签之后

<head>
    <title>内部样式</title>
    <style type="text/css">
         /*里面用的是选择器,以标签选择器为例*/
        标签名{
            样式名:样式值1;
            样式名:样式值2;
            样式名:样式值3;
            .....
        }
    </style>
</head>

说明:这种便于平常练习使用,因为不要文件之间翻来翻去

3 外部引入

思路:

a.新建一个css文件

b.在css文件里面写代码

c.在html文件中head标签里面(title标签位置的后面)使用link标签引入css文件

引入css文件的位置: head标签里面且在title标签之后

 <!-- 调用创建css的文件的方法 -->
<link rel="stylesheet" href="css文件存放的位置">

注意css文件里面的语法格式如下:

   /*不用写style什么的,以标签选择器为例*/
标签名{
    样式:样式值1;
    样式:样式值2;
    .....
}

4.总结

开发过程中,用外部引入比较多

学习过程中,建议使用内部样式,便于自己去练习代码

至于行内(行间)样式,就根据业务场景来使用

SSS4362
关注
专栏目录
CSS-初识cs 层叠样式表，引入样式的三种方式
weixin_44486539的博客
09-28 1028
概述 Cascading(级联) Style(样式) Sheets(工作表) 层叠样式表；CSS 负责页面样式，属于网页中的样式层；CSS 规则是由“选择器” 和 “格式语句” 组成，通过 “选择器” 查找页面中指定的 HTML 元素，结合 “格式语句” 来控制元素的样式；所谓的 “格式语句” 就是CSS的属性，CSS的属性有很多类别，例如：尺寸、文本、背景、边框等；目前 CSS 的最新版本是 c...
CSS（层叠样式表）
AER的故事的博客
03-13 179
一般链接式 写在前面 后面样式会覆盖前面样式，内层样式会覆盖外层样式 优先级排序：导入式在后面的情况 行内样式>链接式>内嵌式>导入式（在后面的链接式） 导入式在...
CSS系列之文件引入方式
StayAlive1887的博客
07-28 1577
在index.html需要引用main.css文件，使用link标签引入css文件，link标签的href属性指定css文件的路径，这里使用的是相对路径。 /* 这里的css文件在一个style的文件夹中，名为main.css */将css代码写在标签内，style标签可放在html文档的任意位置，一般放在标签下。color:red;>美味烧烤烤肉
添加层叠样式表的四种方法
AJAX、DWR及Bank Teller Sytem
11-16 963
我们为网页添加样式表的方法有四种。1．最简单的方法是直接添加在HTML的标识符（tag）里：网页内容举个例子：CSS实例代码说明：用蓝色显示字体大小为10pt的“CSS实例”。尽管使用简单、显示直观，但是这种方法不怎么常用，因为这样添加无法完全发挥样式表的优势“内容结构和格式控制分别保存”。 2．添加在HTML的头信息标识符里：样式表的具体内容-->type=”text/css”表示样式表采用MI
CSS的三种引入方式——三种书写CSS的方式
最新发布
weixin_64294248的博客
07-17 271
CSS是组成网页的重要部分，一种用于设置网页外观（表现）的文档，CSS不是一种编程语言。CSS（英文全称：Cascading Style Sheets），意为层叠样式表，CSS主要用于美化页面，我们平时所看到的界面效果，大多都离不开CSS样式。
如何引入css文件?
ljyahaha的博客
01-31 267
行内样式表(不提倡使用): 也就是使用style嵌入标签中,比如以下形式： <div style="font-size:14px;color:green;"></div> 内部样式表: head标签中添加一个style属性,前期可以使用，比较直观 <head> <style type="text/css"> h3{ color:red; } </style> </h.
CSS引入方式、层叠样式表、继承
weixin_48796690的博客
10-09 167
CSS引入方式、层叠样式表、继承
CSS层叠样式表的层叠是什么意思(自我理解)
09-25
CSS层叠样式表（Cascading Style Sheets，简称CSS）是一种用于描述网页及应用程序用户界面外观和表现的样式语言。层叠的概念是CSS的核心特性之一，它涉及到样式表中的继承、权重和覆盖规则，帮助开发者有效地管理和...
CSS3样式表- 层叠样式表种类.pptx
05-06
CSS3，全称Cascading Style Sheets（层叠样式表），是用于描述HTML或XML（包括各种XML方言，如SVG、XHTML等）文档样式的样式表语言。它允许我们将样式规则与内容分离，提高了网页设计的灵活性和可维护性。CSS3是CSS...
CSS层叠样式表
jcf52的博客
04-20 3715
一.css 介绍 层叠样式表，是一种样式表语言，用来描述HTML和XML文档的呈现。随着HTML的发展，为了满足面设计者的要求，HTML添加了很多显示功能，但是随着这些功能的增加，使得HTML越来越杂乱，HTML 页面也越来越臃肿，CSS便随之诞生，CSS 用于简化HTML标签，把关于样式部分的内容提取出来，进行单独的控制，使结构与样式分离开发。 CSS 是以HTML为基础，设置网页的外观显示样式，如字体、颜色、背景的控制及整体的布局等，和HTML 类似，CSS也不是真正的编程语言，甚至不是标记语言。..
css层叠样式表——css基础介绍
Xiaohuang的博客
12-08 532
css笔记学习第一天
css选择器层叠样式的三种引入方式
07-14 820
css层叠之意即覆盖 行内样式:(元素内嵌样式) 标签的style属性中添加样式 注意：行内样式的优先级是最高的 但这样做不仅需要逐个元素设好样式，而且软件更新时还不得不逐个元素仔细搞好样式调整,不利于后期维护很容易出错 内接样式(文档内嵌样式): (太low基本不用, 会使网页源码混乱度增加, 即 eg: /*用css选择器在style中设置样式*/ span{ color: gree...
CSSModules引入CSS文件所有class
黄彪博客
07-15 1423
文章参考 问题场景描述 用react写项目的时候，从阿里妈妈icon中引入了字体文件，想通过CSS引入相关字体。在根目录中直接import './assets/fonts/iconfont.css';，发现字体没有引入进来，调试发现相关的class也没有引入进来，有如下两个问题需要解决： CSS 引入字体文件的路径不对 CSS 的class没有引入进来 CSS 引入字体文件的路径不对...
css样式文件的引入方式
m0_71939262的博客
01-09 679
link和@import 引入样式文件
如何引入css
百变鹏仔工作室
02-04 555
以上是一些常见的引入 CSS 的方式，你可以根据实际情况选择适合的方法。记得在使用外部样式表时，要确保 HTML 文件和 CSS 文件的路径正确，并且在 HTML 文件中正确地引用了 CSS 文件。外部样式表（External Style Sheet）：将 CSS 样式保存为一个独立的 CSS 文件（例如 style.css），然后在 HTML 文件中通过。内部样式表（Internal Style Sheet）：将 CSS 样式写在 HTML 文件的。语句在一个 CSS 文件中导入其他 CSS 文件。
html插入css层叠样式表
weixin_54880923的博客
04-14 341
当读到一个样式表时，浏览器会根据样式表格式化html文档 html插入样式表共有三种方式 一、外部样式表 首先，我们需要创建一个css，一般在web项目下的web——>resourse——>css 文件夹下创建，例如，有个css文件example.css 接着就可以在html种插入css，使用<link>标签 <link 二、内部样式表 三、内联样式表 但html通常并不是单独使用以上三种插入方式，可以同时使用两种或三种，这种方式我们称作多重样式。 ...
css（层叠样式表）的引入
QQ1012421396的博客
03-16 629
注意：css样式引入时用的标签，以及标签放在页面的任何位置都可以。 css（层叠样式表，Cascade Style sheet）的引入方式有如下几种： 第一种：在style标签中编写css代码。   只能用于本页面中，复用性不强。 格式： 编写的css代码。。。 例如： a{ color:#FF0000; text-decoration:none; }
在CSS文件里导入其它的CSS文件
RobinWu
01-20 272
/********************************** Use: Main Screen Import ***********************************/ @import "test.css"; 
CSS的引入方式
weixin_30311605的博客
08-10 278
CSS的引入方式最常用的有三种， 第一：在head部分加入<link rel="stylesheet" type="text/css" href="index.css"/>,引入外部的CSS文件。 第二：在head部分加入 <style type="text/css"> div{margin: 0;padding: 0;border:1px red sol...
理解CSS层叠样式表：定义、使用与优势
"CSS层叠样式表" 在网页设计领域，CSS（Cascading Style Sheets）是一种不可或缺的技术，它用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档的呈现方式。由W3C（万维网联盟）制定，CSS让网页设计师能够...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

SSS4362

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值