外链论坛

 找回密码
 立即注册
搜索
查看: 84|回复: 1

html怎么添加css样式?

[复制链接]

3095

主题

2万

回帖

9996万

积分

论坛元老

Rank: 8Rank: 8

积分
99968783
发表于 2024-6-29 13:25:14 | 显示全部楼层 |阅读模式

html添加css样式有三种办法,分别为行内式(运用style属性,在特定的HTML标签内运用)、内嵌式(style标签把css代码放在特定页面的head部分中)、外联式(运用link标签,将外边css文件链接到HTML中)。

1、行内式

运用style属性在特定的HTML标记内设置CSS样式。

意见不要运用内联CSS,由于每一个HTML标记都必须单独设置样式,倘若您只运用内联CSS,管理网站可能会变得非常困难。然则,它在某些状况特别有用。例如,在您拜访CSS文件或仅需要为单个元素应用样式的状况下。带有内联CSS的HTML页面示例如下所示:

<!DOCTYPE html> <html> <body style="bac公斤round-color:black;"> <h1 style="color:white;padding:30px;">Hostinger Tutorials</h1> <p style="color:white;">Something usefull here.</p> </body> </html>

2、内嵌式

内嵌css样式便是把css代码放在特定页面的<head>部分中。内嵌CSS必须放在<style></style>标签之间。

类和ID可用于引用CSS代码,但它们仅在该特定页面上处在活动状态。每次页面加载时都会下载以这种方式嵌入的CSS样式,这般能够加强加载速度。在某些状况运用内嵌样式表特别有用,例如:向某人发送页面模板, 由于一切都在一个页面中,因此看到预览要容易得多。

内部样式表的一个示例:

<head> <style type="text/css"> p {color:white; font-size: 10px;} .center {display: block; margin: 0 auto;} #button-go, #button-back {border: solid 1px black;} </style> </head>

3、外联式

外联式便是运用link标签元素将外边CSS文件(.css文件)引用到HTML页面中,引用需要放在页面的<head>部分中。

这是将CSS添加到html页面上最方便的办法这般,您对外边CSS文件所做的任何更改都将反映在你的网站上。

外联样式表的一个示例:

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

而style.css包括所有样式规则。例如:

.xleftcol { float: left; width: 33%; bac公斤round:#809900; } .xmiddlecol { float: left; width: 34%; bac公斤round:#eff2df; }

如今大都数网站运用外边样式表,外边样式是在单独的文档中编写而后附加到各样Web文档的样式。外边样式表会影响它们所连接的任何文件,这寓意倘若你有一个20页的网站,每一个页面运用相同的样式表,当必须改变的话只需编辑该样式表就可完成这些页面,这使得长时间站点管理变得更加容易。

以上便是html怎么添加css样式?的仔细内容,更加多请关注我!!!

回复

使用道具 举报

3004

主题

2万

回帖

9913万

积分

论坛元老

Rank: 8Rank: 8

积分
99139267
发表于 2024-10-15 18:56:59 | 显示全部楼层
谢谢、感谢、感恩、辛苦了、有你真好等。
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

站点统计|Archiver|手机版|小黑屋|外链论坛 ( 非经营性网站 )|网站地图

GMT+8, 2024-11-9 10:41 , Processed in 0.071001 second(s), 19 queries .

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.