HTML JavaScript CSS
关注
分享
扫一扫
「已注销」
这个作者很懒，什么都没留下…
展开
-
一个简单的HTML渲染器
使用vue做出一个简单的HTML渲染器原创 2023-02-09 15:32:14 · 545 阅读 · 1 评论 -
二分法查找（递归）
<script> let array = [1.2, 2.3, 2.6, 3.5, 4.8, 6.7, 7.7, 8.9]; let leftIndex = 0; let rightIndex = array.length-1; // let element = 4.8; for(let i=0; i<array.length; i++){ let index = binarySearch(array, leftIndex, rig原创 2021-05-27 20:19:35 · 885 阅读 · 0 评论 -
CSS cubic-bezier() 函数 贝塞尔曲线 动画
https://www.runoob.com/cssref/func-cubic-bezier.html转载 2021-04-10 10:24:01 · 562 阅读 · 0 评论 -
CSS学习笔记：一个网页布局
效果图：知识点浮动：float网页布局要素（一般有top、banner、box等）给元素取名字顶层大元素一般是标准流，大元素里面包着浮动元素隐藏列表前面的小黑点：liststyle: none代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=ed原创 2021-04-03 10:44:54 · 192 阅读 · 0 评论 -
CSS学习笔记：一个产品模块
效果：知识点padding和marginCSS中元素定位，父元素加子元素对于一个盒子，先定义其宽高、颜色等大体的样式文字删除线（用于原价）span行内元素，不会换行代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> &l转载 2021-03-29 21:49:23 · 280 阅读 · 0 评论 -
CSS笔记（盒子模型margin、border、padding）
本文来源于pink老师教学视频border、padding都会使盒子变大新浪导航栏制作效果图知识点上下边框设置（粗细、颜色）通过设置padding，使得元素之间的距离相等hover伪类CSS样式设置之前首先清除内外边距代码<!DOCTYPE html><html><head> <title>新浪导航栏</title> <style> /* 先清除内外边距 */转载 2021-03-24 17:15:37 · 195 阅读 · 0 评论 -
CSS学习笔记（选择器的优先级）
本文是对pink老师教学视频的笔记CSS中如何对元素进行定位？CSS中通过选择器进行定位。有元素选择器、类选择器（伪类选择器）、id选择器CSS选择器的权重？选择器选择器权重继承 或者 *0，0，0，0元素选择器0，0，0，1类选择器、伪类选择器0，0，1，0ID选择器0，1，0，0行内样式 style=“ ”1，0，0，0!important∞无穷大复合选择器的权重叠加性复合选择器的权重具有叠加性，比如“ul li”的权重就高于转载 2021-03-22 17:42:06 · 123 阅读 · 0 评论 -
CSS笔记-一个按钮
参考pink老师的教程效果图知识点行内元素转换为行内块元素（目的是使得宽高可设置）背景图片改变标签选择代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>五彩按钮</title> <style> .nav a { display: inline-blo转载 2021-03-20 12:04:46 · 129 阅读 · 0 评论 -
CSS笔记2021.03.20
本文仿照pink老师的视频效果图知识点行内元素转为块元素a标签如何取得下划线文字如何对齐鼠标滑过 hover代码<!DOCTYPE html><html lang="en"><head> <title>Document</title> <style> a { display: block; line-height: 40px;转载 2021-03-20 09:46:10 · 120 阅读 · 0 评论 -
CSS笔记
CSS的元素显示模式分为块元素和行内元素常见的块元素：<h1>~<h6>,<p>,<div>,<ul>,<ol>,<li>块元素的特点：独占一行高度、宽度、内外边距可设置默认宽度是容器的宽度（一整行）是一个容器及盒子，里面可以放行类或块级元素文字类的元素里面不能包块级元素，比如p里面不能放diva标签里面可以放块级元素行内元素的特点：相邻行内元素在一行宽高无法直接设置默认宽度就是内容本身的转载 2021-03-18 21:29:10 · 77 阅读 · 0 评论 -
网页排版1
效果图知识点批量字体设置如何定位到某个元素（用class）行高line-height代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=dev原创 2021-03-17 20:02:45 · 149 阅读 · 0 评论 -
HTML 滑动条改变页面背景颜色
效果图<!DOCTYPE html><html> <head> <title></title> <style> div { position: absolute; left: 35%; top: 40%; } input {原创 2021-03-04 19:42:17 · 1942 阅读 · 3 评论 -
HTML5 canvas 2048小游戏
<!DOCTYPE html><html> <head> <title>2048</title> <style> canvas{ background-color: white; } </style> </head> <body> <canvas id="mycanvas" style="position:absolute ">该浏览器不支持.原创 2021-02-27 17:16:32 · 552 阅读 · 0 评论 -
HTML5之canvas，画一个时钟
<!DOCTYPE html><html> <head> <title>北京时间</title> </head> <body> <canvas id="mycanvas">该浏览器不支持canvas</canvas> <script> var canvas = document.getEle.原创 2021-02-25 21:10:56 · 222 阅读 · 0 评论 -
HTML5 canvas 画平抛小球
<!DOCTYPE html><html> <head> <title>小球平抛运动</title> </head> <body> <canvas id="mycanvas">该浏览器不支持canvas</canvas> <script> var mycanvas = document.ge.原创 2021-02-24 22:08:57 · 362 阅读 · 0 评论 -
canvas绘制曲线
效果图（是动图，但是博客里面怎么放动图呢，望不吝赐教）：<!DOCTYPE html><html> <head> <title>画曲线在canvas上</title> </head> <body> <canvas id="mycanvas" width="1000px" height="550px" style="border:1px solid;原创 2021-02-18 20:28:23 · 456 阅读 · 1 评论