前端
关注
分享
扫一扫
文章平均质量分 60
心灵的制造商
喜欢搞些小的研究；爱运动
展开
-
用echarts 仪表盘修改开发的环形图
使用echarts 仪表盘修改开发成的环形图原创 2022-07-07 11:07:24 · 521 阅读 · 0 评论 -
自定义 CSS 重置
reset自定义 CSS 重置这是我使用了很多年的 CSS 重置样式代码这是我使用了很多年的 CSS 重置作为一个开发者，我觉得您应该拥有一份这样的重置。把它带入你的项目，并随着时间的推移，当你学习新事物或发现新技巧时，它会进行调整。1、新建一个css 文件，2、复制代码放到刚新建的css文件中，3、在你的项目中头部link引入。样式代码*, *::before, *::after { box-sizing: border-box;}* { margin: 0;}html, b原创 2022-04-26 16:50:51 · 420 阅读 · 0 评论 -
rem单位 布局学习布局笔记；
rem(root em)是一个相对单位，类似于em, em是父元素字体大小。不同的是rem 的基准是相对于HTML元素的字体大小原创 2022-04-09 10:35:52 · 247 阅读 · 0 评论 -
Flex 布局笔记
Flex 布局由容器flex container和项目flex item两部分组成，容器默认存在两根轴：水平的主轴main axis和垂直的交叉轴cross axis，项目默认以主轴排列。 Flex 属性包括容器属性和项目属性两部分，容器上可设置：flex-direction、flex-wrap、flex-flow、justify-content、align-items、align-content6 个属性，项目上同样可设置 6 个属性，分别为：order、flex-grow、flex-shrink、fle原创 2022-02-10 09:55:24 · 741 阅读 · 0 评论 -
静态UI组件开发实例页面代码收藏
静态UI组件开发实例页面实现的重点技巧就是利用**::first-line**伪元素的文字控色技术<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><titl转载 2022-01-20 09:34:50 · 311 阅读 · 0 评论 -
jquery-confirm.js弹出窗调用自定义DIV
一、引入相关脚本<link type="text/css" href="css/jquery-confirm.css"/><script src="js/jquery-confirm.js"></script>二、HTML代码<style type="text/css"> .tbBox{display:none;} .tbBox .tbHead{height:30px;} .tbBox .tbBody{padding:15p原创 2021-11-26 15:06:44 · 1090 阅读 · 0 评论 -
HTML5性能优化方法，延迟加载
方法一：直接把加载的文件放到文档的底部<!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale = 1.0, maximum-scale=1.0, user-scalable=0"> <title>BCM登录</title><!-- 地原创 2021-11-05 15:07:47 · 1567 阅读 · 0 评论 -
HTML5思维脑图插件推荐
**一、jsMind**jsMind 是一个显示/编辑思维导图的纯 javascript 类库，其基于 html5 的 canvas 进行设计。jsMind 以 BSD 协议开源，在此基础上你可以在你的项目上任意使用。你可以在此浏览适用于 jsMind 的 BSD 许可协议(中英文版本)。官网地址核心代码<div id="jsmind_container"></div><script type="text/javascript" src="../js/jsmin原创 2021-10-20 12:00:27 · 12340 阅读 · 6 评论 -
javascript学习笔记五
JavaScript HTML DOM通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。当网页被加载时，浏览器就会创建页面的文档对象模型（Document Object Model）。HTML DOM 模型被构造为对象的树：通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。JavaScript 能够改变页面中的所有 HTML 元素JavaScript 能够改变页面中的所有 HTML 属性JavaScript 能够改变页面中的所有原创 2021-07-22 09:08:43 · 135 阅读 · 5 评论 -
background: linear-gradient 实现表格横线及 line-height-step运用
line-height-step运用及背景实现表格横线line-height-step简单介绍实例代码完成后的效果图实现横线核心代码line-height-step简单介绍CSS中的line-height-step属性可以让文字内容占据的行高永远是line-height-step属性值的整数倍。语法：line-height-step: 仔细阅读这篇文章可以访问W3C官网介绍，https://www.w3.org/TR/css-rhythm-1/属性值只能是长度值，初始值是0实例代码废话不多说；原创 2021-03-26 18:07:12 · 625 阅读 · 0 评论 -
两个ul标签中的li互相移动
都是专业人员看的东西；废话不多说，直接上代码；1、使用前请先引入jquery.js插件CSS代码如下：<style type="text/css">.clearfix:before,.clearfix:after {content: " "; display: table; }.clearfix:after {clear: both; }.leftSide{width:300px;padding:10px;}.leftSide .leftTop,.leftSide .le原创 2020-09-17 15:17:43 · 696 阅读 · 0 评论 -
position定位与overflow影响容器内部提示框显示问题
position定位与overflow影响容器内部提示框显示问题问题描述基础代码如下显示效果图解决问题方法问题描述因为使用了一个滚动条美化插件；该插件使用div容器做滚动条，所以使用了position：relative相当定位与position: absolute绝对定位与overflow：hidden影响容器内部提示框显示问题。基础代码如下<div style="max-heigh...原创 2019-05-15 15:37:18 · 1149 阅读 · 0 评论 -
基于锚点定位和overflow的选项卡
如果在不考虑使用JS插件或者Query的情况下，基于锚点定位和overflow的选项卡，废话不多说，直接上代码，大家一看就明白CSS代<style type="text/css">.container{margin:30px auto;width:500px;height:250px;}.container .tab_head{ height:40px; bac...原创 2019-05-06 17:24:56 · 597 阅读 · 0 评论 -
jQuery显示动态时间
一、实例效果图二、实例代码说明该实例依赖于jQuery1、试用前引入jQuery.js核心库；2、在body内编写前端html代码；代码如下：实例1<div class="clock"> <div class="time"> <span class="time_hours"></span>原创 2019-01-16 11:38:12 · 1496 阅读 · 3 评论