java 修饰css 3

CSS使用方式
2.1 内联方式

把CSS样式嵌入到html标签当中,类似属性的用法,示例如下:
<div style="color:blue;font-size:50px">This is my HTML page. </div>
好处:可以单独什么某个元素样式,缺点:不利于样式重用
1
2
3
2.2 内部方式

在head标签中使用style标签引入css,示例如下:
<style type=“text/css”> //告诉浏览器使用css解析器去解析
div{color:red;font-size:50px}
</style>
好处:可以控制页面中多个元素样式,缺点:只能一个页面使用
1
2
3
4
5
2.3 外部方式

将css样式抽成一个单独文件,谁用谁就引用,好处:多个页面可以同时使用。
示例如下:
单独文件div.css: 内容示例:div{color:green;font-size:50px}
引用语句写在head标签内部,

链接式:
<link rel="stylesheet" type="text/css" href=“div.css"></link>
rel:代表当前页面与href所指定文档的关系
type:文件类型,告诉浏览器使用css解析器去解析
href:css文件地址

导入式:

<style type="text/css">
@import url("div.css")
</style>
该内容放在head标签中

备注:link和@import区别:
1.link所有浏览器都支持,@import某些版本低的IE不支持
2.@import是等待html加载完成才加载,link解析到这个语句,就加载
3.@import不支持js动态修改

优先级:内联样式>内部样式>外部样式,就近原则。注意:内部样式和外部样式的位置

<link href="mycss.css" rel="stylesheets" type="text/css">
<style type="text/css">

</style>


<body>

</body>

posted @   zhuzhurr  阅读(24)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 零经验选手,Compose 一天开发一款小游戏!
· 因为Apifox不支持离线,我果断选择了Apipost!
· 通过 API 将Deepseek响应流式内容输出到前端
点击右上角即可分享
微信分享提示