加入收藏 | 设为首页 | 会员中心 | 我要投稿 聊城站长网 (https://www.0635zz.com/)- 智能语音交互、行业智能、AI应用、云计算、5G!
当前位置: 首页 > 综合聚焦 > 编程要点 > 语言 > 正文

CSS的行内样式、内嵌样式和外部引用样式如何使用?

发布时间:2023-08-22 14:49:35 所属栏目:语言 来源:
导读:这篇文章给大家分享的是CSS的行内样式、内嵌样式和外部引用样式的使用。小编觉得挺实用的,因此分享给大家做个参考,文中的示例代码介绍得很详细,有需要的朋友可以参考,接下来就跟随小编一起了解看看吧。

这篇文章给大家分享的是CSS的行内样式、内嵌样式和外部引用样式的使用。小编觉得挺实用的,因此分享给大家做个参考,文中的示例代码介绍得很详细,有需要的朋友可以参考,接下来就跟随小编一起了解看看吧。
 
    三种的使用方法的简单实例如下:
 
    行内样式:
 
<!doctype html>
 
<html>
 
<head>
 
 <meta charset="UTF-8">
 
 <title>css行内样式</title>
 
</head>
 
<body>
 
<div style="width:100px;height:100px;background:red;"></div>>
 
 
 
</body>
 
</html>
 
    内嵌样式:
 
<!!doctype html>
 
<html>
 
<head>
 
 <meta charset="UTF-8">
 
 <title>css内嵌样式</title>
 
</head>
 
<body>
 
<style type="text/css">
 
#div{width:100px;height:100px;background:red;}
 
</style>
 
<div id="div"></div>>
 
 
 
</body>
 
</html>
 
    外部式:
 
<!doctype html>
 
<html>
 
<head>
 
 <meta charset="UTF-8">
 
 <title>css内嵌样式</title>
 
 <link rel="stylesheet" type="text/css" href="ccss.css">
 
</head>
 
<body>
 
<div id="div"></div>>
 
 
 
</body>
 
</html>
 
    css文件
 
#div{width:100px;height:100px;background:red;}
 
    简言之:
 
    行内样式:就是代码写在具体网页中的一个元素内;比如:<div style="color:#f00"></div>
 
    内嵌式:就是在</head>前面写;比如:<style type="text/css">.div{color:#F00}</style>
 
    外部式:就是引用外部css文件;比如:<link href="css.css" type="text/css" rel="stylesheet" />
 
 

(编辑:聊城站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章