自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(23)
  • 收藏
  • 关注

原创 antv g6收缩树绘图

最近工作需要,用了antv g6绘图,参照了官网的例子<template> <div id="container"></div></template><script>import { defineComponent, onMounted, ref, watch } from "vue";import { getKinship } from "@/services/study.js";import G6 from "@antv/g6"

2021-11-25 17:06:21 1113

原创 vue(一)

1.VUE基础1.javascript框架2.简化Dom操作3.响应式数据驱动

2021-02-23 14:22:57 155

原创 JavaScript练习(四)——图片库

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>JavaScript图片库</title> <style> * {

2020-12-02 18:45:14 260

原创 JavaScript练习(三)——二级菜单

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>二级菜单</title> <style> * { paddin

2020-11-26 16:04:18 292

原创 JavaScript练习(二)——轮播图

1.主要代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>轮播图</title> <style> * {

2020-11-26 09:57:45 216

原创 JavaScript练习(一)——DOM增删改

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>添加删除记录</title> <script> window.onload =

2020-11-21 20:26:26 156

原创 JavaScript基础——部分练习

1、输入三个数,从小到大排列输出 <script> //prompt()函数的返回值是String类型的 var num1 = +prompt("请输入一个数字"), //在prompt前加一个+号把prompt()函数的返回值变为number类型 num2 = +prompt("请再输入一个数字"), num3 = +prompt("请最后输入一个数字"); if (num1 < num2 &&

2020-11-13 10:04:44 234

原创 移动端flex布局——仿携程网

html<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scalable=1.0, minimum-scale=1.0" /&gt

2020-11-09 16:55:04 403

原创 2020-11-07 移动端web开发

学习目标:Web服务器学习内容:3.1 什么是web服务器是提供计算服务的设备,它也是一台计算机。在网络环境下,根据服务器提供的服务类型不同,服务器又分为文件服务器、数据库服务器、应用程序服务器、 web服务器等。Web服务器一般指网站服务器,可以向浏览器等web客户端提供文档、放置文件,可供浏览。分为本地服务器和远程服务器。**3.2 远程服务器**是别的公司提供的计算机,上传网站到服务器里,别人通过域名就能访问了...

2020-11-08 21:45:30 392

原创 品优购静态页面(html+css)——注册页

html部分<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" href="css/common.css" /> <link

2020-11-04 21:07:57 955

原创 品优购静态页面(html+css)——商品详情页

HTML部分<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>品优秒杀、即将售罄、超值低价</title> <link rel="stylesh

2020-11-04 21:00:34 6925 1

原创 品优购静态页面(html+css)——主页

我又来了,又是一个静态页面(●’◡’●)html部分<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>品优购-正品低价、品质保障、配送及时、都是我编的!</tit

2020-11-04 20:41:51 2433 3

原创 2020-10-30 HTML5和CSS3提高

学习目标:html5的新特性学习内容:1.html5的新增特性主要是针对于以前的不足,增加了一些新的标签、新的表单和新的表单属性等。这些新特性都有兼容性问题,都是IE9+以上版本的浏览器才支持1.1 html5新增的语义化标签 <header></header> 头部标签 <nav></nav> 导航标签 <article></article> 内容标签 <section></secti

2020-11-01 09:39:28 863

原创 2020-10-29 CSS(六)

学习目标:精灵图字体图标学习内容:1.1 为什么需要精灵图为了有效地减少服务器接收和发送请求的次数,提高页面的加载速度,出现了CSS精灵技术核心原理:将网页中的一些小背景图片整合到一张大图中,这样服务器只需要一次请求就可以了。1.2 精灵图的使用核心:精灵技术主要针对的是背景图片。就是把福哦个小背景图片整合到一张大图片中去。移动背景图片位置,此时可以使用background-position移动的距离就是这个目标图片的x和y坐标。注意网页中的坐标有所不同因为一般情况下都是往上

2020-10-30 20:19:58 270

原创 2020-10-28 CSS(五)定位

学习目标:定位学习内容:1.1 为什么需要定位浮动可以让多个块级盒子一行没有缝隙排列显示,经常用于横向排列盒子。定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中的某个位置,并且可以压住其他盒子。1.2 定位组成定位 = 定位模式 + 边偏移定位模式用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置。定位模式定位模式决定元素的定位方式,它通过CSS的position属性来设置,其值可以分为四个:值语义static静态定位

2020-10-29 15:30:17 274

原创 学成在线首页——静态页面(html+css)素材链接放在文章结尾了

这是我第一次做一个完整的静态页面,是照着PSD图做的。有做的不对或者不好的地方,欢迎批评指正。效果图:html代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>学成

2020-10-28 21:09:08 13532 25

原创 2020-10-25 CSS(四)浮动

学习目标:CSS 浮动学习内容:1 浮动(float)1.1 传统网页布局的三种方式网易布局的本质——用CSS来摆放盒子CSS提供了三种传统的布局方式:普通流(标准流)浮动定位实际开发中,一个页面基本都包含了这三种布局方式。1.2 标准流(普通流/文档流)标签按照规定好的默认方式排列块级元素独占一行,从上到下排列行内元素会按照顺序,从左到右排列,碰到父级元素自动换行...

2020-10-26 21:08:24 182

原创 2020-10-23 CSS(三)

学习目标:CSS的三大特性学习内容:1.1 层叠性相同选择器给设置相同的样式,此时一个样式就会覆盖另一个冲突的样式。层叠性主要解决样式冲突的问题。层叠性原则:样式冲突。遵循就近原则,哪个样式离结构近,就执行哪个样式样式不冲突,不会层叠1.2 继承性子标签会继承父标签的某些样式,如文本颜色和字号恰当地使用继承可以简化代码,降低了css样式的复杂性子元素可以继承父元素的样式(text-,font-,line- 这些元素开头的可以继承,以及color属性)行高的继承性body

2020-10-25 16:04:35 159

原创 2020-10-20 CSS(二)

学习目标:Emmet语法CSS的复合选择器学习内容:1 Emmet语法Emmet语法的前身是zen coding,它使用缩写,来提高html/css的编写速度,Vscode内部已经集成该语法。1.1 快速生成html结构语法生成标签,直接输入标签名,按tab键即可如果想要生成多个相同标签,加上就行,比如div3如果有父子级关系标签,可以用>,比如 ul>li如果有兄弟关系的标签,用+就可以了 比如div+p如果生成带有类名或者id名字的,直接写 .demo 或者 #d

2020-10-22 21:56:36 163

原创 2020-10-18 CSS(一)

学习目标:CSS简介CSS基础选择器学习内容:1.1 HTML的局限html只关注内容的语义特点:丑可以做简单的样式,但是臃肿和繁琐1.2 CSSCSS是层叠样式表,也叫CSS样式表或级联样式表CSS也是一种标记语言CSS主要用于设置html页面中的文本内容、图片的外形以及版面的布局和外观显示样式。CSS可以美化htmlCSS最大价值:由html专注去做结构呈现,样式交给CSS,即结构与样式相分离1.3 CSS语法规范CSS规则由两个主要的部分构成:选择器以及一条或多条声明

2020-10-19 12:29:46 249

原创 2020-10-15 html(三)

学习目标:表格标签列表标签表单标签学习内容:1.1表格的主要作用显示、展示数据,不是用来展示页面的1.2表格的基本语法<table> <tr> <td>.......</td> </tr> ........</table>table用来定义表格tr定义表格中的行,必须嵌套在table标签中td定义单元格,必须嵌套在tr中1.3表头单元格标签表格第一行或第一列,文本内容加粗居中展示`1

2020-10-15 20:12:22 120

原创 2020-10-13html(二)

学习目标:html常用标签html中的注释和特殊字符学习内容:1.1 超链接标签1.1.1超链接的语法格式<a herf="跳转目标" target="目标窗口的打开方式">文本或图像</a>1、属性:herf :用于指定链接目标的url地址(必须属性)target:用于指定链接页面的打开方式,其中_self在当前窗口打卡,为默认值。_blank为在新窗口打开方式。2、链接分类外部链接:<a herf="http://www.baidu.com"

2020-10-13 22:54:11 129

原创 2020-10-12 html(一)

学习目标:网页常用浏览器Web标准html标签html常用标签学习内容:一、网页1.1 网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。html文件1.2 html指的是超文本标记语言,不是编程语言(超文本:图片、视频、超链接等超越了文本限制)二、常用浏览器2.1 五大浏览器:IE(Trident)、火狐(Gecko)、谷歌(Blink)、Safari(Webkit)和Opera(Blink)2.2 浏览器内核(渲染引擎):负责读取网页内容,整理

2020-10-12 23:21:12 242

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除