前端HTML5
关注
分享
扫一扫
源视频:https://www.bilibili.com/video/BV17z4y1D7Yj?spm_id_from=333.1007.top_right_bar_window_custom_collection.content.click (千锋HTML5前端开发教程 1000集)
前端学习笔记
Lynan、
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
0034-网格布局
原创 2022-02-17 17:36:43 · 173 阅读 · 0 评论 -
0033-3D
原创 2022-02-17 16:54:38 · 187 阅读 · 0 评论 -
0032-关键帧动画
原创 2022-02-17 16:34:59 · 197 阅读 · 0 评论 -
0031-2D属性
原创 2022-02-17 16:19:33 · 130 阅读 · 0 评论 -
0030-过渡
原创 2022-02-17 16:09:41 · 126 阅读 · 0 评论 -
0029-渐变
原创 2022-02-17 16:04:57 · 127 阅读 · 0 评论 -
0028-响应式布局
原创 2022-02-17 15:48:06 · 134 阅读 · 0 评论 -
0027-多列布局
原创 2022-02-17 15:27:03 · 129 阅读 · 0 评论 -
0026-怪异盒模型
原创 2022-02-17 15:24:48 · 118 阅读 · 0 评论 -
0025-字体
原创 2022-02-17 15:14:45 · 136 阅读 · 0 评论 -
0024-阴影
文本阴影多阴影设置直接在后面加逗号隔开继续写。盒子阴影原创 2022-02-16 18:04:47 · 126 阅读 · 0 评论 -
0023-CSS3选择器
CSS3介绍CSS3选择器E>F 父子E+F 紧挨着的亲兄弟E~F 后面的所有亲兄弟X：nth-child(n):第几个，偶数2n(even)，奇数2n+1,2n-1(odd)可以用于点击描点显示相应元素，类手风琴样式。原创 2022-02-16 17:49:47 · 111 阅读 · 0 评论 -
0022-H5新增
#H5新增音频，视频标签增强表单1.input属性2.数据列表3.属性原创 2022-02-16 16:28:38 · 126 阅读 · 0 评论 -
0021-表单补充
输入框(input) 样式input {width: 100%;}以上实例中设置了所有 元素的宽度为 100%，如果你只想设置指定类型的输入框可以使用以下属性选择器：input[type=text] - 选取文本输入框input[type=password] - 选择密码的输入框input[type=number] - 选择数字的输入框输入框填充使用 padding 属性可以在输入框中添加内边距。input[type=text] {width: 100%;padding: 12px原创 2022-02-15 16:18:59 · 193 阅读 · 0 评论 -
0020-宽高自适应
原创 2022-02-15 16:00:31 · 197 阅读 · 0 评论 -
0019-定位
原创 2022-02-15 15:56:45 · 134 阅读 · 0 评论 -
0018-元素显示类型
原创 2022-02-15 12:26:52 · 131 阅读 · 0 评论 -
0017-溢出属性
原创 2022-02-15 12:14:54 · 121 阅读 · 0 评论 -
0016-盒子模型
1.盒子模型盒模型是css布局的基石，它规定了网页元素如何显示以及元素间相互关系。css定义所有的元素都可以拥有像盒子一样的外形和平面空间，即都包含边框、边界、补白、内容区，这就是盒模型。2.Padding属性1、padding的使用方法（内间距）当分析一个缝隙相对于当前容器来说是里面的时候，就用padding。填充：padding,在设定页面中一个元素内容到元素的边缘(边框) 之间的距离。 也称补白。用法：1）用来调整内容在容器中的位置关系2）padding值是额外加在元素原有大小之上的，原创 2022-02-14 14:15:51 · 232 阅读 · 0 评论 -
0015-浮动属性
浮动属性个数属性描述说明1floatfloat：left；元素靠左边浮动2floatfloat：right；元素靠右边浮动3floatfloat：none；元素不浮动浮动的作用1定义网页中其他文本如何环绕该元素显示浮动的作用2让竖着的东西横过来正常的文档流都是独占一行，竖向排列的当一个元素不再在文档流中占据空间，而是漂浮在文档流的上方的时候叫做脱离文档流1、浮动会脱离网页文档，与其他不浮动的元素发生重叠2、但是不会与文字发生原创 2022-02-14 13:56:41 · 114 阅读 · 0 评论 -
0014-背景属性
个数属性描述说明1background-color背景颜色background-color：red；2background-image背景图片background-image:url();3background-repeat背景图片的平铺background-repeat:no-repeat/repeat/repeat-x/repeat-y；4background-position背景图片的定位background-position：水平位置 ..原创 2022-02-14 13:41:44 · 106 阅读 · 0 评论 -
0013-列表属性
个数属性描述说明1list-style-type定义列表符合样式list-style-type:disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉符号)2list-style-image将图片设置为列表符合样式list-style-image:url();3list-style-position设置列表项标记的放置位置。list-style-position：outside；列表的外面 默认值list-style-posit..原创 2022-02-14 13:32:11 · 309 阅读 · 0 评论 -
0012-文本属性
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>15-原创 2022-02-14 13:25:08 · 396 阅读 · 0 评论 -
0011-选择器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>14-原创 2022-02-14 12:59:22 · 261 阅读 · 0 评论 -
0010-css
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>13-原创 2022-02-11 18:49:48 · 222 阅读 · 0 评论 -
0009-表单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>12-原创 2022-02-11 18:20:05 · 133 阅读 · 0 评论 -
0008-table表格
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>11-原创 2022-02-11 18:19:14 · 112 阅读 · 0 评论 -
0007-超链接
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>10-原创 2022-02-11 18:14:24 · 257 阅读 · 0 评论 -
0006-图片标签
图片标签的路径<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl原创 2022-02-11 18:12:11 · 210 阅读 · 0 评论 -
0005-列表
列表-有序列表 无序列表 无序列表 无序列表 无序列表 有序列表（type类型1，a，A，i，I。start第几个开始，取值只能是数字。） 有序列表 有序列表 有序列表 自定义列表 可以是文字也可以是图 相关文字 <!DOCTYPE html...原创 2022-02-11 18:09:01 · 119 阅读 · 0 评论 -
0004-div和span标签
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>div原创 2022-02-11 18:04:20 · 215 阅读 · 0 评论 -
0003-特殊符号
尖角号 <左尖角号 >右尖角号 < hr noshade />空格 该空格占据宽度受字体影响明显而强烈。  占据的宽度正好是1个中文宽度，且基本上不受字体影响。版权 © © 商标 ™ ™ ® ®表情 😀 ...原创 2022-02-11 17:59:38 · 324 阅读 · 0 评论 -
0002-hr
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>不一样原创 2022-02-11 16:53:34 · 321 阅读 · 0 评论 -
0001-标签
<!DOCTYPE html><!-- 特殊且固定的文档 固定标签 --><html lang="en"><!-- 告诉浏览器，我们以下写的代码是什么语言，对搜索引擎优化和浏览器有用“en”英文，“zh-CN”中文,"ja-jp"日文 --><head> <meta charset="UTF-8"><!-- 字符集 --> <meta http-equiv="X-UA-Compatible"原创 2022-02-11 16:47:12 · 228 阅读 · 0 评论