自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 用js写弹幕

HTML <div id="box"> <div id="content"> <img src="./images/u=414259162,185616959&fm=26&gp=0.jpg" alt=""> <!-- <p class="danmu"> <img src="./images/u=414259162,185616959&a

2021-04-13 20:32:09 179

原创 用js写轮播图

HTML <div class="wrapBox"> <div class="swiperBox"> <p class="active"> <img src="./images/QQ图片20201106100557.jpg" alt=""> </p> <p><img src="./images/QQ图片2020

2021-04-13 20:29:57 80

原创 用js写购物车

CSS<style> * { margin: 0; padding: 0; list-style-type: none; } a { color: #666; text-decoration: none; } table { border-collapse: colla

2021-04-13 20:25:34 191

原创 用js写轮播图

HTML<div class="wrapBox"> <div class="swiperBox"> <p class="active"> <img src="./images/QQ图片20201106100557.jpg" alt=""> </p> <p><img src="./images/QQ图片20201

2021-04-13 20:22:36 64

原创 用js写进度条

HTML <div id="progress"> <!-- 进度条 --> <div id="filldiv"></div> <!-- 百分比 --> <span id="percent"></span> </div>CSS <style> #progress { position:

2021-04-13 20:18:37 204

原创 用js写选项卡

HTML <button class="on">1</button> <button>2</button> <button>3</button> <p class="active">111</p> <p>222</p> <p>333</p>CSS<style> p {

2021-04-13 20:15:38 84

原创 用js写日历

这是css<style> * { margin: 0; padding: 0; list-style: none; } #box { width: 280px; height: 360px; margin: 50px auto; background: url(./QQ图片2.

2021-04-13 20:12:54 67

原创 用js写留言板

这是css<style> * { padding: 0; margin: 0; } body { width: 100%; height: 100%; background: rgb(65, 65, 63); } .bacground { width: 700px;.

2021-04-13 20:09:23 142

原创 全选与反选

var oneCheck = document.getElementById('checkone'); var allCheck = document.getElementsByClassName('checkAll'); //全选 oneCheck.onclick = function () { // 遍历每一个allcheck的值 for (var i = 0; i < allChe...

2021-04-13 20:05:55 62

原创 移动端上下固定方法

移动端上下固定效果html,body { height:100%;}body { display:flex; flex-direction:columu;} 滚动条:overflow-y:scroll;让他不收缩.header { height:100px; background-color:#ffo; flex-shrink:0; }.footer { height:100px; background-color:#000; flex-shri

2021-03-17 20:38:51 197

原创 响应式布局

弹性布局flex-grow用法给左边设宽度后,右边的平分剩余空间.left { width:260px; }.right {flex-grow:1;}伪类选择器加图片方法.chat dd p:before { content:url()}响应式布局宽度百分比高度自适应区分不同屏幕大小媒体查询/*手机端*/@media screen and (max-width:767px) {}/*平板*/@media screen an

2021-03-13 10:58:27 70

原创 弹性盒模型

弹性盒模型弹性盒模型是一种新的布局模式。页面需要适应不同的屏幕大小以及设备类型弹性盒模型使用步骤定义弹性盒 display:flex;确定主轴 flex-direction:row / column / row-reverse / column-reverse主轴对齐 justify-content flex-start / flex-end / center / space-around / space-between是否换行 flex-wrap:wrap / nowra

2021-03-13 09:42:27 104 1

原创 2021-03-04

浮动的问题清除浮动就是让飘的盒子依然在文档中占位浮动和display:inline-block 不要共存, 因为都是实现左右排列注意的问题display:block 独占一行 , margin:auto 对block元素生效居中用display:inline-blocktext-align:center 写在父元素上面,对行内和行内块生效固定定位bug定位会改变元素的宽度.加了定位得给宽度定位不占位置,下面的盒子得给一个外边距硬挤圆角bo

2021-03-04 19:53:53 77 1

原创 3.3

有序列表 ol 无序列表 ul 自定义列表 dl网络中的单标签: hr br img input matepadding不可以有负值 ,margin可以有负值清除浮动的方法给父盒子设高在所有浮动后面加一个div 上设 style= “clear:right”(重要) overflow: hidden 在父元素上面加行内元素,左右排列不支持宽高?方法一: 浮动的盒子就支持宽高,浮动改变元素特性,无论什么标签都支持宽高和间距方法二 :display:block未知.

2021-03-03 20:53:20 58

原创 3.02知识点整理

css的基石就是盒模型: padding + margin + border + contentmargin:auto 和 margin:0 auto是相等的背景尺寸 background - size必须单独写经常更换的图片用 img 直接插入 但是logo比较重要也用img不会更换的小图标用背景图图片垂直居中方法: 1. 在父元素上写行高 2. 在图片上写vertical-align列表前的圆点可用背景图做 background: url() no-repaet 0 c.

2021-03-02 17:51:35 83 1

原创 网页bug和权重问题

1.bug 1如果子元素的 margin-top 传递到父元素上,父元素和子元素一起下来解决方案:在父元素上面添加 overflow:hidden或者有浮动 , margin-top 也不会传递到父元素上2.溢出隐藏初始化:1. white-space:nowrap (文本强制不换行)2. overflow:hidden (溢出隐藏)3. text-overflow:ellipsis (文本超出省略号)3.bug 2图片

2021-03-01 20:56:56 109

原创 部分整理知识点

通配符选择器:*外边距:margin:right/left文本水平对齐:text-ailgn:center/left/right文本居中对齐:行高等于高/line-height首行缩进: text-indent

2021-02-26 15:54:57 66

原创 标签和类

1,标签的嵌套嵌套:大盒子套小盒子嵌套规则:块级标签嵌套行内标签p 不能嵌套块级元素,可嵌套行内元素行内标签之间可以相互嵌套 a标签不能嵌套a标签双标签嵌套单标签,单标签不能嵌套2.类名类名使用规则:不能使用中文不能用数字开头不能使用特殊符号建议使用小写单词记单词:background-color 背景色height 高度width 宽度...

2021-02-24 18:47:54 116

原创 网页标签和路径

1.标签标签的分类:块级标签和行内标签ul里面必须是li,li里面可以随便写br换行 hr水平线行内标签有:span b加粗 strong强调加粗 del删除线 em强调倾斜 sup上角标 sub下角标2.路径路径分为绝对路径和相对路径网络中不允许使用绝对路径相对路径:就是通过当前文件找到目标文件 …/返回上一级相对路径的底线就是不能跨盘...

2021-02-23 17:31:46 150

原创 网站建设流程

网站建设流程注册域名租用空间网站建设1.确定网站主题2.搜集资料3.规划网站4.制作页面网站推广网站维护你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计 ,将会带来全新的写作体验;在创作中心

2021-02-23 09:34:54 171

空空如也

空空如也

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

TA关注的人

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