前端
Html:
html标签
-
< strong >加粗 --文本格式化标签
-
< em >倾斜
-
< ins >下划线
-
< del >删除
-
< img src="图片的url" >src用于指定图像的位置名称(属性名+属性值=属性)
- alt 替换文本
- title 提示文本
- width 图片宽度
- < a href="">链接（段落内空格+
- target="_blank"跳转新窗口
- < audio >音频
- loop 循环播放
- autoplay 自动播放 （禁用
- controls 显示音频面板
- < video sec=>视频
- muted 静音播放
- 同（7）
9 . 列表
无序列表：< ul > < li >
有序列表：< ol > < li >
定义列表：< dl > < dt(标题)> < dd(描述)>（一个标题对应多个内容
10. 表格
- < table > < tr(行)> < td(内容)> < th(表头)>
- < thead > < tbody > < tfoot > (表格结构标签-代码优化)
- rowspan' colspan' （合并单元格）[ rowspan ="2" ]
11. 表单（登录，注册，搜索
- < input type="">
- placeholder' （占位文本）
- radio -name -checked'
- file -multiple'
- checkbox -checked'
| type属性值 | 说明 |
|---|---|
| text | 文本框，输入单行文本 |
| password | 密码框 |
| radio | 单选框 |
| checkbox | 多选框 |
| file | 上传文件 |
12. 下拉菜单
- < select > < option > -selected'
13. 文本域
- < textarea >
- < label >
- 增大点击范围[input...id label...for] (*直接label包裹)
15. 按钮
| type属性值 | 说明 |
|---|---|
| submit | 提交数据到后台（默认 |
| reset | 重置 |
| button | 普通 |
- < form >表单区域 -action=""
无语义布局标签
-
< div >独占一行
-
< span >不换行
CTRL+/==注释
单标签
- < hr >水平线
- < br >换行
字符实体
- 空格 -
- < - <
- > - >
CSS
引入
外部引入< link rel="stylesheet" href="" >
类选择器
一个标签可用多个类名
文字控制属性
（google默认大小16px
| 属性 | 效果 |
|---|---|
| font-family | 字体(最后 衬线) |
| text-indent | 文本缩进（em） |
| text-align | 水平对其方式-设置在父级 |
| text-decoration | 修饰线 |
| font-weight | 加粗'数字 |
| font-style | italic倾斜 |
| color | RGBA |
- text-decoration line-through'删除线 over...' under...'
选择器
-
通配<标签<类<id<行内<important
- div span
- div > span
- span,div,p
- p.box
- hover:悬停
- 超链接：:hover :link :visited :hover :active
Emment
.box------
bgc------
w500------
背景属性
- background-image url'
- background-repeat no-...' ...-x' ...-y'
- background-position x,y'
- background-size contain/cover
- background-attachment
显示模式
- 块级 block；
- 行内块 inline-block；
- 行内 inline；
结构伪类选择器
E:nth-child(N) N------ 2n ;2n+1...
伪元素选择器
E::before / E::after （content'
盒子模型
- border
- padding top,right,bottom,left/top,left-right,bottom/top-bottom,left-right
- 尺寸 box-sizing:border-box
- margin (0,auto(要有盒子宽度))
- 元素溢出overflow hidden' scroll' auto' 塌陷问题
- 塌陷：父级设置 overflow：hidden/border-top；取消子级margin设置父级padding
浮动
块元素水平 添加后脱离标准流
- 清除浮动 单/双微元素法