css概念
层叠式样式表，一种来表现HTML的文件样式的计算机语言
功效：静态修饰网页，能够协同各样脚本语言动态地对网页各元素进行格式化
css的构成
层叠式：css中贯穿始终的加载特性
1.层叠性
2.继承性
样式：定义怎样表示HTML元素
1.文字文本
2.背景
3.盒模型
4.浮动
5.定位
6.其他
css代码书写位置
有4种书写方式：内联式、内嵌式、外联式、导入式。
内联式：行内式
书写位置：在HTML标签之上的style属性中书写css样式
所有的css样式属性总体构成标签的style属性的属性值
<div style="width:100px;height:100px;font-size:14px;">1</div>
内联式缺点
1.内联式必要写在标签上，无完全脱离html标签
2.css样式代码让标签结构繁重，有害于HTML结构诠释
3.一个内联式css代码，只能给一个标签运用，倘若有多个标签有相同的样式，一样的css代码要写多次
很繁琐。
实质工作中不运用内联式编写css代码
内嵌式
书写位置：在HTML文件中，在head标签里面写一个style标签，所有css代码写在style标签内部。
内嵌式特点：
优点：
1.实现了结构和样式的初步分离css负责样式，HTML负责结构
2.多个标签能够利用一段代码设置相同的样式，节省代码量。
缺点：
1.结构和样式并无完全分离，代码依然写在HTML文件的 style内部。
2.css样式只能给一个HTML文件运用，不可够被多个HTML文件同期运用。
3.在HTML中倘若css代码太多，会导致文件头重脚轻。
外联式
书写位置：在一个单独的扩展名为.css的文件中
在css文件中直接书写css规则。
引用：在HTML中head标签内部运用link标签进行引入。
link标签属性属性名属性值说名rel“stylesheet”引入的外边文件与HTML之间的关系，样式表hrefcss文件路径引入css文件type“text/css”暗示加载时代码根据纯文本形式的css代码加载。H5中能够省略不写外联式优点：
1.实现了HTML和css完全分离
2.多个HTML文件能够共用一个css文件，便于提取公共css，减少代码量
3.能够实现一个css变化，多个HTML页面同期变化，减少工作量
4.一个HTML文件能够引入多个css文件，能够实现同一个页面中css代码分层
导入式
工作中很少运用导入式
实质应用:
小型案例：能够运用内嵌式css
实质工作、大型网站项目：举荐运用外联式css
css规则
1.css代码在给某个标签设置样式前，必要运用选取器选选中标签
2.css样式的属性，属性名和属性值的键值对写法为k:v;
3.给每一个选取器添加样式属性都必要写在一对大括号{}之内
4.给一个标签添加所有必须的样式，都必须在{}内部一一陈列出来
重视：
1.分号， 每条属性后面的分号都必要写，倘若不写会引起后面的所有代码加载错误
2.css中所有属性与属性之间对空格、换行、缩进不敏锐
恰当添加注释，使得css代码清晰易读
/*注释内容*/
代码书写标准
展开格式：研发过程运用，代码可读性强，便于调错。
紧凑格式：上传服务器时运用，减少不必要的空白字符，压缩文件体积，便于传输。
css中的英文能够体积写，不举荐运用大写
空格规范
1.选取器与大括号{}之间保存一个空格
2.冒号后面，属性前面，保存一个空格
文字三属性
颜色color
给文字设置颜色
属性名k:color
属性值v：颜色名、颜色值
颜色名
运用颜色的英文单词进行暗示 颜色单词红色red黑色black橙色orange白色white黄色yellow金色gold绿色green粉色pink青色cyan浅黄色lightyellow蓝色blue黄绿色yellowgreen紫色purple天蓝色skyblue更加多的颜色名能够经过w3c手册查找到
字体font-family
定义元素内文字的字体
属性名k：font-family，字体属于font综合属性的一个单一属性
属性值v：字体名叫作，必要包裹在一
| 
发表于 2024-6-30 10:43:04