ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

初识CSS

2022-06-21 21:03:53  阅读:109  来源: 互联网

标签:样式 标签 初识 选择符 CSS 选择器 css


CSS

层叠样式表

css语法:

样式属性名:属性值

优点

①使HTML专注于网页的内容,CSS专注于网页的表现

②提供了丰富的格式化功能

③可以针对各种可视化浏览器(主要有显示器、打印机、PDA等)来设置不同的样式

CSS与浏览器

并不是所有的CSS的样式都被浏览器支持

不同的浏览器对CSS的实现有细微的不同,需要特别注意

1.行内样式

直接使用标记的style属性

style=" width:100px; height:100px; background-color:#F00;”

2.内嵌样式

在HTML中,使用<style></style>标记,将样式写在<style>标记内

注意:<style>标记要指定type属性为text/css

3.链接样式(外链式)

将CSS写入单独的一个文件中,注意该文件的文件扩展名为  .css
在HTML文档中使用<link>标记引入css文件
<link>标记需要指定两个属性:type和rel(relationship)
例:<link type="text/css" rel="stylesheet" href=“sy.css" />

4.使用导入样式

使用@import指令可以将css文件中的css样式导入到不同的地方
导入式的结果和直接书写是同样的效果
导入式可以共享样式代码
可以在内嵌式里使用导入,也可在css文件中使用
导入样式的使用方法
@import url(“sheet1.css”);
@import “sheet1.css”;

link引入的样式权重大于import

css选择器

类型(标记)选择器

即使用标签的名字作为选择符
语法:标签{规则}
例:td{color:#F00;}

ID选择器

每个html标签的id都是不一样的
语法:#id{规则}

类(class)选择器

语法:.className{规则}
注意:也可以在前面添加标签名字,如div.className(之间无空格,和包含选择符区分开)
可以为标签指定多个class值,多个值之间用空格隔开
例:<div class="dv top">

包含选择器 后代选择器

通过标签的嵌套选择标签,只要包含就行
语法:选择符a  选择符b {规则}
选择符之间用空格隔开,即选择符a标签内的所有选择符b标签

标签:样式,标签,初识,选择符,CSS,选择器,css
来源: https://www.cnblogs.com/aureazjl/p/16398333.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有