-sea--CSDN博客

原创 CSS 圣杯布局的多种实现方式，以及各种方法的优缺点总结。

关于圣杯布局的提问？实现下图布局，Header 和 Footer 固定高度 100px，Left 和 Right 固定宽度 200px，Middle 部分的宽度自适应。圣杯布局的实现？1. flex[代码实现]重点在与 main 中设置 display 为 flex，left 、right 定宽设置为 200px，middle 设置 flex: 1 即可<header>Header</header> <main> <div cla

2021-03-27 15:35:07 442

原创【Three.js】BufferGeometry 基础讲解（position、normal、color、index）

1. BufferGeometry首先，在 three.js 中有THREE.Mesh 网格、THREE.Points 点、THREE.Line 线条等模型。其中： Mesh 网格模型创建的物体是由一个个小三角形组成，如下面各图。这些小三角形又是由三个点确定，需要三个确定的位置，即确定的 xyz Points 模型创建的物体是由一个个点构成，每个点都有自己的位置，Points 相当于点的集合。 Line 模型创建的物体是连续的线条，这些线可以理解为是按顺序把所有点连接起来。

2020-12-01 15:34:06 15481 3

原创【Three.js】官方彩色粒子立方体旋转实例详解

1. 效果图2. 详细步骤2.1 创建场景、相机、渲染器// 声明场景、渲染器、相机变量let scene, renderer, camera;// 获取窗口宽度高度let ww = window.innerWidth, wh = window.innerHeight;// 调用初始化函数init();/** *@method 初始化函数 */function init() { // 创建场景 scene = new THREE.Scene(); // 创

2020-11-30 09:25:53 880

原创滚动列表实现

1. 效果图2. 文件结构jquery 文件：链接: https://pan.baidu.com/s/1GdW7PfcFo_Pf9c_hRKiaCw 提取码: nqq1 复制这段内容后打开百度网盘手机App，操作更方便哦3. index.html 基础结构4. CSS样式5. JS 逻辑// 模拟数据 let dataList = [ { name: '张一山' },{ name: '王晓义' },{ name: '李光洁' },{ name: '张雨绮' }

2020-11-16 13:26:44 1341

原创关于分辨率的理解

工作遇到一大屏项目，对方给的数据是 2m*2m 的屏，分辨率是 1920*1080。如是陷入思考，屏幕显示比例为1：1，分辨率却是1920：1080 即 16：9，这样真的没问题吗？这样画面不会压缩？物理尺寸和分辨率到底是什么关系，为了弄清除，做了一些简单的代码测试。然后果然是对方数据给错了。1. 电脑屏幕尺寸是什么以我自己的电脑联想y7000为例，屏幕为15.6英寸，这里的15.6指的是电脑对角线的长度，英寸是长度单位，1英寸=2.54厘米。对于一个直角三角形来说，只知道斜边的长...

2020-11-06 11:47:12 827

原创使用 excelJs 插件导出 excel 实例（原生js，非 node 环境）

1. 实现功能现有数据如下：dataList = [ { name: '獐伞', age: 18, gender: '男' }, { name: '里斯', age: 18, gender: '女' }, { name: '汪芜', age: 18, gender: '男' }];导出效果如下图：2. 步骤第一步：引入插件<script src="./js/exceljs.js"></script>下载链接: https:

2020-08-17 15:23:23 1572 2

原创 echarts 中使用百度地图 bmap （基础使用：仅显示、定义样式）

1. 实现功能实现简单的自定义样式百度地图，仅显示（基础，可自己研究扩展）效果： 2. 代码步骤第一步：创建基础结构，id=“map” 的 div做 echarts 容器<!DOCTYPE html><html><head> <title>Echarts - 百度地图</title> <meta charset="utf-8"> <style type="text/css"> ...

2020-08-11 11:05:29 10280 8

原创【CSS样式】checkbox 自定义样式纯 css 实现，选中打勾✔

实现效果未选中状态 & 选中状态全部代码<!DOCTYPE html><html lang="en"><head> <title>Checkbox</title> <meta charset="utf-8"> <style type="text/css"> ...

2019-09-05 14:41:21 1959 1

原创【elementUI样式】实现 element-ui el-input 组件获得焦点后边框样式修改

【实现效果】获得焦点后 el-input 边框高亮【问题】之前常用 :focus 处理 input 获得焦点后样式的修改，但是 elementui 中要修改的其实并不是 input 标签的样式，而是封装的一个 el-input 组件，其实是一个 div，需要实现 el-input 组件中的 input 获得焦点后，修改最外层 div 的样式，仍用 :focus 是没法修改的【解决】...

2019-09-04 11:12:28 12545 6

qq_34695703的博客