- 博客(29)
- 收藏
- 关注
RSS订阅原创 导航样式记录-滑块效果(原生+JQ)
可以根据样式修改滑块的形状，不一定是矩形，改为下边框，圆角，圆形，背景图均可；滑块移动可以根据过渡动画（transition）选择移动的速度、类型等。这里使用版本（jquery-3.7.1.min.js）
2024-01-10 11:41:12
406
原创 git 命令记录
Git命令用户：git config --global user.name ‘账号名称’邮箱：git config --global user.email ‘邮箱账号’创建文件夹：mkdir test进入文件夹：cd test创建仓库：git init创建文件：touch one.html提交文件到暂存区：git add one.html提交文件到仓库：git commit -m ‘add one.html’删除文件1：rm -rf a1.php删除文件2：git rm a1.php删
2021-02-27 23:35:04
106
原创 bootstrap4-表单
表单表单控件1.文本控件如 input、select、textarea 统一采用 .form-control 样式进行处理优化，包括外观、选中状态、大小等；2.上传文件则用 .form-control-file 代替了 .form-control ；3.大小规格使用.form-control-lg 和 .form-control-sm 样式控制控件大小；4.输入范围使用 .form-control-range 设置水平滚动范围输入；5.只读属性readonly属性 防止控件的值
2020-10-03 21:19:59
505
原创 Tp5（二）载入静态页面文件
Tp5（二）载入静态页面文件在本地打开新建的tp5框架，进入以下路径，并新建视图(view)和模型(model)文件夹再打开view文件夹，新建与控制器名相同的文件夹，这里是index，所以新建index文件夹再将静态页面复制到 index文件夹中，静态页面的html文件就导入成功在编辑器中显示文件夹层级在编辑器中进行index页面渲染，打开控制器注意：此时的首页是没有样式的，若是html文件的名字与控制器的方法名不是相同的，则需要的fetch的括号里面用"html文件名（无后缀）"的
2020-08-28 14:12:39
1027
2
原创 layui初学（页面元素）
layui初学（页面元素）文章目录**layui**初学（页面元素）导入layui文件**图标使用**使用字符字体使用样式按钮使用按钮主题按钮尺寸图标按钮圆角按钮按钮组按钮事件监听导航菜单样式水平导航菜单垂直导航菜单（layui-nav-tree）支持徽章和图片导入layui文件<!-- 导入样式文件 --><link rel="stylesheet" href="../layui/css/layui.css"><!-- 导入js文件 --><scrip
2020-08-17 23:47:55
239
原创 Tp5(一)——下载并搭建入门网站
在官网中将Tp5框架下载下来，建议下载完整版的；这里框架以thinkphp5.0.24，以编辑器phpstorm2018.1，用phpstudy_pro集成环境作为示例，下载解压后是这样的接着将解压后的文件夹拖入php的根目录下面将之前的解压文件拖入到WWW文件夹中，根据自己的项目来命名之后，打开phpstudy集成环境点击进入网站，点击创建网站按钮进行网站配置根目录最好放到public文件夹创建成功后，点击管理，在弹出的列表中，点击打开网站会直接进入框架的首页
2020-07-10 00:08:41
431
原创 用jQuery制作选项卡
用jQuery制作选项卡需要利用标题和内容的索引关系，利用索引来找到与标题相关的内容板块；代码示例：<body><div> <ul class="title" id="title"> <li class="show"><a href="#">标题1</a></li> <li><a href="#">标题2</a></li>
2020-07-09 23:08:05
349
原创 用function类来写二级导航
学习了对象和function类后，利用function类 建立function高级类来书写二级导航；由于在页面内，二级导航可能不止一个，所以需要将每个导航的id设置为类的参数一、创建function类/* function 的默认值用对象结构的形式书写 */let subNav = function( { id = 'navUl' }={} ){ this.id = id;};二、创建function类的方法/* 方法建议构建在function类的外部，并且需要写在原型上 *
2020-05-30 21:20:42
135
原创 响应式布局初始(一)
响应式布局初始（一）响应式布局是为了实现网页页面适应各种设备屏幕，如手机打印机等各个不同的终端。媒体查询模块媒体查询（Media Queries）查询主要包括两个重要的内容：媒体类型和媒体特性；媒体类型媒体指定的值类型描述all所有的媒体设备screen显示器、手机、平板等设备print打印机或者打印预览视图speech屏幕阅读器等发声设备handheld如Pad和小型电话等掌上设备或者更小的设备tv电视机类型设备projecti
2020-05-19 00:19:23
216
原创 制作一个选项卡功能
制作一个选项卡功能，点击标题出现与之对应的内容；参考图：代码参考：HTML文件：<body><div id="head" class="head"> <ul> <li onclick="Option(1)">选项卡一</li> <li onclick="Option(2)">选项卡二</li> <li onclick="Option(3)">选项
2020-05-09 16:15:50
233
原创 JS笔记：实现九宫格抽奖
用JavaScript写一个九宫格的抽奖盘；点击中间的块，选中奖品的亮块会在边缘的8个块循环；选中后，弹出选中的内容；代码参考：HTML文件:<body><div class="box"> <ul id="jiangPin"> <li><a href="javascript:viod(0);"><span>奖品 1</span></a></li> &
2020-05-09 13:13:59
530
原创 JS事件笔记：数字时钟与一定时间后可点击按钮
创建一个时间对象Date()，利用时间对象Date()的get类方法来获取系统的时间；getHours()获取小时；getMinutes()获取分钟；getSeconds()获取秒。通过获取的时分秒来制作一个数字时钟，以及在5秒钟之后才能点击按钮的效果：效果图如下：HTML代码演示：<body><button class="time" id="time" disa...
2020-04-21 13:54:31
246
原创 JS事件笔记：音乐播放器
运用JavaScript制作一个网页音乐播放器。静态图片：HTML文件：<body><!-- 音频 --><div id="musicplayer"> <audio id="music" src="#"></audio></div><!-- 音频 end --><!-- 播放器界...
2020-04-18 12:53:30
399
原创 JS事件笔记：banner轮播
利用列表对banner图片进行布局，用绝对定位叠加图片，以display隐藏图片和显示第一张图片，用定位布局切换按钮和控制点；HTML代码：<body><!-- banner --><div class="banner"> <ul class="bannerUl" id="bannerUl"> <li>&l...
2020-04-03 15:53:00
278
原创 form表单属性集合
在HTML中有很多地方都需要登录注册搜索,就会涉及到form表单;表单常用属性:属性描述name表单的名字action提交表单的目标method提交表单的方法(get)enctype上传文件有文字和图片时input常用类型类型（type）作用text单行文本框password密码输入框radio单选框...
2020-03-31 16:38:40
527
原创 JS事件笔记（BOM）：弹出选择窗口
利用JavaScript来制作弹窗进行选择的效果利用window.open打开新的窗口，用window.opener获取父窗口的标签；这里运用到的window常用方法和属性方法描述open打开一个新窗口close关闭浏览器窗口focus把焦点给予一个窗口opener返回当前打开窗口的父窗口对象，是一个window对象parent返回父窗口...
2020-03-25 22:52:19
640
原创 JS事件笔记：二级导航
完成的一次作业效果图JavaScript写二级导航在JavaScript文件中对相应标签添加鼠标事件：鼠标进入和鼠标离开（mouseenter, mouseleave）{ let nav = document.getElementById("nav"); //读取页面id为nav的标签 let navLi= nav.children; //读取nav的所有子标签 ...
2020-03-25 11:45:46
459
1
原创 JS事件笔记：图片切换
开始学习事件，将课上的一些内容记录一下。在站点文件下建立一个images文件来放置图片；在html文件中：<div class="box"> <img id="myPic" src="images/pic1.jpg" alt=""/> <div class="but"> <div class="left" id="ba...
2020-03-24 22:47:16
151
原创 HTML的二级导航
当鼠标移上时显示二级导航代码以下： <div> <ul class="one"> <li>A <ul class="two two_1"> <li>1</li> <li>2</li> ...
2020-03-03 22:42:07
6299
原创 HTML中表格标签——合并单元格
合并单元格两种方式：1）跨行合并；2）跨列合并；目标单元格（需要合并的单元格，写合并单元格的代码）：1）跨行：目标单元格是最上侧单元格；2）跨列：目标单元格时最左侧单元格；合并单元格的小步骤：1）确定单元格合并的方式：跨行还是跨列；2）找到目标单元格，写下代码；3）删除多余的单元格。如图1，一个3*3的表格：将其合并单元格，如图2：如图所示，将第一行中2，3单元格合并在一...
2020-03-01 20:26:21
920
原创 HTML中表格基本用法与属性
表格的布局、显示数据等作用，更多的是用来显示数据。表格的基本语法：<p>表格的几个部分 table表格、thead表头、tbody主体、tfoot表尾 </p>!--表格--><table align="center" border="1" cellpadding="50" cellspacing="0" width="600px" > &...
2020-03-01 19:59:33
175
原创 HTML中的列表类型
列表的特点就是整齐、整洁、有序，布局时会更加自由和方便；列表可以分为三大类：无序列表、有序列表、自定义列表；1、无序列表<p>无序列表 基本语法格式</p><p>您的爱好是：</p><ul> <li>篮球</li> <li>长跑</li> <li>...
2020-02-28 21:51:59
2888
原创 HTML中链接css与js文件和超链接的分类
1、链接外部的css文件和JavaScript文件<head> <meta charset="UTF-8"> <title>link</title> <link rel="stylesheet" href="style/csdn.css"> //放在head标签</head>...
2020-02-27 17:09:45
871
原创 HTML中字体格式标签
小字标签 1. 小字 2. <small>心有落桥雪</small>大字标签 1. 较大字号 2. <string>心有落桥雪</string> 3. 大号字 4. <big>心有落桥雪</big>粗字体标签 1. 粗字 2. <b>心有落桥雪</b>斜体字标签 1....
2020-02-26 13:01:26
563
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人