html css的学习笔记

h1——h6：标题（h1-h3可以被搜索引擎搜索到 h1标签一个网页只许有一个）
div：无实意标签（盒子）
span：无实意标签
ul：无序列表（黑点）ul的儿子只能是li（可通过type更改黑点样式）
ol：有序列表（123）ol的儿子只能是li（可通过type更改123样式）
a：超链接 样式：a href="网址"XXX</a>
img：图像 样式：img src="路径" alt="需显示的文字" alt：如果无法显示图像，浏览器将显示替代文本

块标签：必须独自霸占一整行，默认宽度100% （div p h1-h6 ul ol等）

行内标签：可以默认共处一行，不可设置宽高 （a span strong等）

行内块标签：既可以设置宽高 又可以共处一行 （input img）

 

css特性:
 层叠性；
 继承性。
驼峰命法：
 大骆驼命名名法ClassName
 小驼峰命名法classname
优先级：
后来者居上原则，越往后越说了算
id(100)>class(50)>tag(1)
!important 优先级最最高级 但不建议使用 会导致代码维护性变差 将来不好改
行内样式表（标签内部的style）>头部样式表（head标签里的style）=外部样式表（外部css用link引入）

margin（外边距）
padding（内边距）
margin方向（顺时针）：上右下左
solid：实线边框
dashed 虚线边框
dotted 点线边框
double 双线边框

定位分五种：
相对定位（relative）：相对于其本身在文档流中的位置定位，还会占据原先位置
绝对定位（absolute）：相对于离它最近的已定位的父级定位
固定定位（fixed）：相对于浏览器窗口定位
静态定位（static）：默认位置
粘性定位（sticky）：始终出现在网页上浮动:

浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止

a标签不会继承父级的字体颜色，需要单独设置
float可设置文字环绕图片，最好不要用float设置文字位置
list-style: none 不使用符号
disc : 默认值，实心圆。
circle : 空心圆。
square : 实心方块。
decimal : 阿拉伯数字。
lower-roman : 小写罗马数字。
upper-roman : 大写罗马数字。
lower-alpha : 小写英文字母。
upper-alpha : 大写英文字母。
none : 不使用项目符号
text-decoration: none 无文本修饰
none 无装饰，通常对html下划线标签去掉下划线样式
underline 下划线样式
line-through 删除线样式-贯穿线样式
overline 上划线样式

做网页先从大模块开始做起，然后再做小模块
checkbox(复选框) ，再次点击它，可取消选中
radio(单选按钮) ，再次点击它，不能取消选中
placeholder 提供可描述输入字段预期值的提示信息

hover 鼠标移到图片上可换图
ul li{width:150px;}后代选择器 可以选择作为某元素后代的元素
ul>li{width:150px;} 子代选择器 与后代选择器相比 子元素选择器 只能选择作为某元素子元素的元素

transform 对元素进行旋转、缩放、移动或倾斜

transition是一种动画形式，一定要配合hover使用
transition 可以设置过渡效果
transition-property 用于指定应用过渡属性的名称
transition-duration 用于指定这个过渡的持续时间
transition-delay 用于指定延迟过渡的时间
transition-timing-function 用于指定过渡的类型

animation：
定义动画 @keyframes
使用(调用)
@keyframes animation{
0%{
...
}
100%{
...
}
}
linear 动画从头到尾的速度是相同的。匀速
ease 默认。动画以低東开始，然后加快，在结束前变慢。
ease-in 动画以低速开始。
ease-out 动画以低速结束。
ease-in-out 动画以低速开始和结束。
steps 指定了时间函数中的间隔数量

transform: rotate X/Y/Z(角度) translateX/Y/Z(移动距离);
x轴平行，y轴垂直，z轴指向正对的屏幕。

 

npm的使用

Windows+r

cmd

查看已安装版本：npm -v
npm config get registry
淘宝镜像：npm config set registry https://registry.npmmirror.com
npm config get registry
在webstorm安装：
npm init -y
npm i normalize.css

git的基本配置

1、设置用户名和登录邮箱
git config--global user.name"用户名称"
git config--global user.email"登录邮箱"
2、生成密钥
ssh-keygen -t ed25519 -C “邮箱”
3、不设置密码 两步回车

git上传

git add .
git commit -m 第一次
git config --global user.email "you@example.com"
git config --global user.name "Your Name" 输入 邮箱 用户名
git add .
git commit -m 第一次
git push
git push （若干次）