如何在html中添加css样式

如何在html中添加css样式,第1张

有两种方式

1、在head标签之间添加style标签

2、直接在HTML代码里添加style属性,然后在属性里定义css代码

3、也可以将1中的style标签里的内容放到一个css文件里,然后在html页面引用这个文件也是一样的效果

<link href="css文件路径" rel="stylesheet">  <!--这样就可以了,尽量代码简洁-->

4、下面是我的HTML代码

有3种方式:
分别如下:
1--行间样式表(内联样式)
<div style="……"></div>
2--内部样式表
<style>
选择器{属性:属性值}
</style>
3--外部样式表
<link href="stylecss" rel="stylesheet“ type=“text/css”/>

1、直接使用行内样式,即在html标签上使用style

<div style="width:100px;height:100px;background:red;">div内容</div>

2、先定义css样式,再给html的class属性赋值

<style>
content{
    width:100px;
    height:100px;
    background:red;
}
</style>
<div class="content">
    div测试内容
</div>

总结:两种方式效果是一致的,只是第二种方式可进行重用,只要html元素class属性相同即可

在html网页中引入引入css主要有以下四种方式:
(1)行内式
<p style=”color:red”>网页中css的导入方式</p>
(2)嵌入式
<style type=”text/css”>
P{ color:red }
</style>
嵌入式一般写在head中,对于单个页面来说,这种方式很方便。
(3)导入式
<!-- 导入外部样式:在内部样式表的<style></style>标记之间导入一个外部样式表,导入时用@import。 -->
<style type="text/css">
@import "jisuancss";
</style>
(4)链接式
<link href="jisuancss" rel=”stylesheet” type=”text/css” />

导入式和链接式差不多,都是从外部引入css文件。但是链接式对于客户端用户浏览网站时,效果会好些。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/13392157.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-07-27
下一篇 2023-07-27

发表评论

登录后才能评论

评论列表(0条)

保存