CSS样式引入

本文介绍了CSS样式的四种应用方式:行内式通过style属性设置元素样式;内嵌式将CSS代码写在HTML头部;外链式通过link标签链接外部样式表;导入式使用@import导入外部样式。这些方法各有优缺点,适用于不同的场景。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

目录

1、行内式

2、内嵌式

3、外链

4、导入时(不常用)


1、行内式

行内式也称为内联样式,是通过标签的style属性来设置元素的样式

基本语法格式如下:

<标签名 style="属性1:属性值1; 属性2:属性值2; 属性3:属性值3;"> 内容 </标签名>

代码举例说明:

<h2 style="color:red;font-size:28px ;">行内式CSS样式</h2>

2、内嵌式

内嵌式是将CSS代码集中写在HTML文档的<head>头部标签中,并且用<style>标签定义

基本语法格式如下:

<head>
      <style type="text/css">
            选择器 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
      </style>
</head>

代码举例说明:

<head>
    <style type="text/css">
			div{
				width: 1000px;
				margin: auto;
				text-align: center;
			}
    </style>
</head>

3、外链

外链式是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中,通过<link />标签将外部样式表文件链接到HTML文档中

基本语法格式如下:

<head>     <link href="CSS文件的路径" type="text/css"  rel="stylesheet" /> </head>

代码举例说明:

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

4、导入时(不常用)

导入式针对外部样式表文件。对HTML头部文档应用style标签,并在<style>标签内的开头处使用@import语句,即可导入外部样式表文件。

基本语法格式如下:

<style type="text/css" >
       @import url(css文件路径);或 @import "css文件路径";
       /* 在此还可以存放其他CSS样式*/
</style>

代码举例说明:

<head>	
    <style type="text/css">
		@font-face{
			font-family:jianzhi;      /*服务器字体名称*/
			src:url(FZJZJW.TTF);      /*服务器字体名称*/
		}
		p{
			font-family:jianzhi;      /*设置字体样式*/
			font-size:32px;
		}  
	</style>
</head>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值