示例 2 : 把样式代码写在style.css,并在html中包含它 示例 3 : css是本地文件 如何包含
样式代码写在style标签里
<style>
.p1{
color:red;
}
.span1{
color:blue;
}
</style>
<p class="p1">红色</p>
<span class="span1">蓝色</span>
<style> .p1{ color:red; } .span1{ color:blue; } </style> <p class="p1">红色</p> <span class="span1">蓝色</span>
创建一个文件叫style.css
其内容为 .p1{ color:red; } .span1{ color:blue; } 然后在html中包含该文件 <link rel="stylesheet" type="text/css" href="/study/style.css" /> 注:style.css文件里,就不要再使用style标签了 <link rel="stylesheet" type="text/css" href="https://how2j.cn/study/style.css" />
<p class="p1">红色</p>
<span class="span1">蓝色</span>
<link rel="stylesheet" type="text/css" href="https://how2j.cn/study/style.css" /> <p class="p1">红色</p> <span class="span1">蓝色</span>
在测试的时候,大家写的css文件都是放在本地的,比如d:/style.css
这时就应该写成 href="file://d:/style.css"
HOW2J公众号,关注后实时获知最新的教程和优惠活动,谢谢。
![]()
问答区域
2020-01-24
没有正确加载css的看这里
回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
2019-01-24
引用CSS文件后 背景图片加载不出来。
1 个答案
Wang20180504 跳转到问题位置 答案时间:2019-03-05 首先观察要引入的图片(文件)在项目什么位置存放。例如当前我们要引入 项目下 WebRoot/css/image/icon.png这张图片;
其次要看清我们需要将图片引到哪个页面上。此处我们将 icon.png这个图片引入到 WebRoot/manage/common.html z这个页面;
有两种方式:
1、一种是绝对路径 此处的绝对路径应该是: http://localhost:8080/ProjectName/css/image/icon.png 即可在common.html页面引入icon.png这个图片。
2、第二种是相对路径 此处的路径应该是: ../css/image/icon.png 既可在common.html页面引入icon.png这个图片。
相对路径../的用法很简单。比如common.html页面在manage文件夹下,../表示返回上级目录。../css/image/icon.png就表示common.html先返回上一级目录 ,在进入css目录下的image目录下的icon.png。
../../就表示当前文件所在目录返回两级菜单的目录下。
回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
2018-02-17
解释一下这行代码的属性可以嘛?
2017-07-20
为什么我的本地超链接不能打开?
2017-05-31
为什么html引用css,网页没有效果呢
提问太多,页面渲染太慢,为了加快渲染速度,本页最多只显示几条提问。还有 1 条以前的提问,请 点击查看
提问之前请登陆
提问已经提交成功,正在审核。 请于 我的提问 处查看提问记录,谢谢
|