css
-层叠样式表（美化网页）
元素框
元素分为两大类 置换元素和非置换元素
置换元素可以设置宽高，称之为行内块元素
display 属性
-dinslpay 有 7 个属性值
| 序号 | 属性值 | 描述 |
|---|---|---|
| 1 | inline默认 |
行内元素,<span>, <a> |
| 2 | block |
块级元素,<div>,<p> |
| 3 | inline-block |
行内块级元素,<img> |
| 4 | list-item |
块级: 列表元素,<li> |
| 5 | table |
块级: 表格元素,<table> |
| 6 | flex |
弹性元素 |
| 7 | grid |
网格元素 |
| 8 | none |
还有个 none 是不显示 |
css 的引入方式
- css 的 4 种方式
| 序号 | 属性值 | 描述 | 备注 |
|---|---|---|---|
| 1 | link标签 |
<link rel="stylesheet" href="..." /> |
外部样式 |
| 3 | @import指令 |
@import url(...) , @import '...' |
外部样式 |
| 2 | <style>元素 |
<style>...</style> |
内部样式 |
| 4 | style=""属性 |
<tag style="..."> |
行内样式 |
css 注释
- 单行/多行:
/* 注释内容 */
媒体查询
- 媒体类型通常会添加”媒体描述符”进行精准限制,例如设置媒体尺寸,分辨率等
- 媒体描述符的语法与 css 样式声明非常类似,如
min-width: 500px - 与 css 声明的不同之处在于,媒体描述符允许没有值,如
print and (color) - 多个 “媒体描述符” 之间使用 “逻辑关键字” 连接, 如
and和not and表示多个”媒体描述符”必须同时满足,- all print screen projetcion
CSS 总结
主要是学习了四种的引入方式，预习了显示级别 行内样式>内部样式>外部样式
