- 博客(18)
- 收藏
- 关注
RSS订阅原创 任务3-1(JavaScript基础)
web前端开发JavaScript基础1.VScode配置:2.JavaScript语法:2.1 注释和console2.2 三个容器关键字2.3 数据类型2.4 类型转换1.VScode配置:需要安装的插件:Live Server, Bracket Pair Colorizer,JavaScript (ES6) code snippet2.JavaScript语法:2.1 注释和console2.2 三个容器关键字 1. var 2. const 常量关键字,不能修改常量的值(但是
2021-08-20 10:14:29
113
原创 前端课程心得
在csdn学习前端的时间将近一个月。经过老师的视频讲解以及任务点的布置，在不断进行学习的过程中发现问题，解决问题。这一个月着重讲解了HTML5和CSS3的相关知识点。掌握了响应式布局、怪异盒模型、选择器、CSS3实现特效效果、animate库、网格布局等等的知识。通过一个基本的网页，再复杂，也可以分解为多个部分，而每个部分又可以再次细分，再运用所学的知识，一步一步实现各个细节效果的实现，好像一切显的没有那么难的无法做到，当然了，学习还只是开始。利用假期，合理掌握时间，及时完成任务，在练习中提升自己。..
2021-08-16 13:20:12
100
原创 任务2-9(网格布局)
文章目录1.网格布局1.列宽2. 间距3. 行高2. 跨行和跨列3. minmax函数4. 自定义网络模板5. 网格布局的媒体查询1.网格布局什么是网格布局: 是一种强大的CSS布局方案，它将网页划分成一个个网格，可以任意组合的网格（类似excel）网格布局是CSS3的布局系统与弹性布局类似网格可以理解成是二维布局（弹性布局是一维的）可以使用align-item justify-content等属性IE11部分支持display:grid 该元素为网格容器grid-template-co
2021-08-14 19:28:20
221
原创 任务2-8(CSS预处理器:Less)
1. Less2. sublime安装less 1、在sublime text3安装插件less和Less2Css) 2、安装nodejs 3、设置添加环境变量 4、安装less，打开cmd ,输入npm install -g less,然后再安装一个插件less-plugin-clean-css命令为：npm install -g less-plugin-clean-css 5、在sublime新建.less文件，然后输入less，每次ctrl+s保存的时候，改less文件会自动保存到当前目
2021-08-13 10:48:37
63
原创 任务2-7(服务器字体+阿里巴巴矢量库)
1. 服务器字体@font-face@font-face{ font-family:自定义名称;src:字体源}<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="w
2021-08-12 15:05:43
68
原创 任务2-6(轮播图+animate库)
文章目录动画轮播图旋转的立方体Loadinganimate库动画轮播图<!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, init
2021-08-12 09:48:45
53
原创 任务2-5(特效)
特效:1. 阴影2. 渐变3. 过渡4. 变形1. 阴影box-shadowtext-shadow阴影:横向偏移量 纵向偏移量 模糊距离 阴影颜色background-color: #454545;color: #333;text-shadow: -1px -1px 0 #cecece,1px 1px 0 #5c5c5c;background-color: #000;color: #fff;text-shadow: -5px -5px 8px #cd12c8,
2021-08-10 08:13:46
81
原创 任务2-4(目标选择器&结构性伪类选择器&CSS变量)
新的选择器1. 目标选择器1.1子代选择器:1.2 兄弟选择器1.3 同级选择器1.4 属性选择器:2. 结构性伪类选择器3. CSS变量1. 目标选择器子代选择器: >兄弟选择器: +针对的是向下寻找紧挨着的元素同级选择器: ~针对的是向下寻找元素属性选择器: [属性名]<body> <ul class="first"> <li>item0</li> <h1>item</
2021-08-08 17:02:31
108
原创 任务2-3(怪异盒模型&弹性布局)
目录:1. 怪异盒模型2. 弹性布局1. 怪异盒模型 正常盒模型:box-sizing:content-box 怪异盒模型:box-sizing:border-box怪异盒模型设置border和padding时会向内扩展,不增加盒模型的面积如果内部空间不够,会向外扩展2. 弹性布局...
2021-08-07 22:31:42
47
原创 任务02-02-响应式布局+rem&em+vh&vw
目录2. 响应式布局媒体查询media部分代码实现:3. 认识em和rem4. 认识vh和vw2. 响应式布局媒体查询media 1.@media only screen and (条件) 2.<link href="xxx.css" media="only screen and (条件)">部分代码实现:<style> body { font-size: 20px; color: white;
2021-08-03 14:24:41
78
原创 任务02-01-HTML5
目录1. 知识总结2.HTML5新结构标签案例实现3.表单元素案例实现4.媒体标签1. 知识总结2.HTML5新结构标签案例实现<!DOCTYPE html><html><head> <title>结构标签案例</title> <style> * { margin: 0; padding: 0; list-style: none;
2021-07-30 16:08:43
51
原创 任务01-05-登录界面
登录界面字体,表格,表单知识点设计图代码实现知识拓展:1. 设置图片居中2. li标签的横向排列3. 实现背景透明，文字不透明字体,表格,表单知识点设计图代码实现 - html代码<!DOCTYPE html><html><head> <title></title> <link rel="stylesheet" type="text/css" href="登录.css"></head><
2021-07-29 15:41:36
91
原创 任务01-04-定位
目录1. 知识框架 :2. 案例实现:1. 知识框架 :2. 案例实现:<!DOCTYPE html><html><head> <title>定位</title> <style type="text/css"> .aaa{ position: fixed; right: 0px; bottom: 0px; } </style></head><body>
2021-07-26 22:42:42
40
原创 任务01-03
<!DOCTYPE html><html><head> <title>轰隆隆</title> <link rel="stylesheet" type="text/css" href="Ex1.css"> <script type="text/javascript" src="Ex1.js"></script></head><body> <div class="h...
2021-07-24 18:05:45
169
原创 任务01-02-标签+浮动+图文组合
文章目录前言一、标签二、浮动及常见样式伪元素 :设置颜色 :背景图的使用三、图文组合考核任务前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。一、标签二、浮动及常见样式display:inline-block属性将div排成一行时出现图片之间出现空隙或者对不齐的状况.采用float的形式,可以解决此类问题<!DOCTYPE html><ht
2021-07-22 14:35:56
66
原创 任务01-01-盒模型
文章目录初识web1.思维导图2.案例初识web盒模型 就是把html页面的元素看作是一个矩形的盒子,也就是一个盛装内容的容器.每个矩形都有元素的内容,内边距(padding),边框(border),外边距(margin)组成.1.思维导图2.案例利用 border 的特性做出三角形沙漏等图案<!DOCTYPE html><html><head> <title>盒模型</title> <style type
2021-07-20 22:39:04
62
原创 web入门知识整理
web入门系列前言一、初识前端二、web文件夹结构三、浅析web结构四、盒模型 < div >4.1 长+宽+背景颜色4.2 内边距4.3 边框4.4 外边距 margin五、CSS的引入方式5.1 内联5.2 外联六、三种基本选择器七、常用标签7.1 块标签7.2 行标签7.3 行块标签八、浮动8.1 float8.2 清除浮动九、定位十、常见css样式10.1 文本10.2 字体10.3 背景前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术
2021-07-19 23:42:44
157
原创 2021-05-26
C1 任务03 - Web基础与布局大厂每年都要招聘大量的前端软件工程师，有些开发基于浏览器应用、有些开发基于H5的应用、而有些可能会开发小程序和桌面应用。不管是做哪种开发工作的前端工程师，都离不开HTML、CSS、JavaScript这三类Web浏览器核心技术。HTML定义了浏览器中各种元素的分类和用途，CSS定义了浏览器页面的整体布局和外观，而JavaScript可以动态创建页面，使网页能够响应用户的点击、拖拽等各种事件，给用户更好的体验。任务一:使用富文本编译器 首先,在开源富文本编译器
2021-05-28 07:34:42
118
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人