11 posts tagged with "front"

View All Tags

前端-移动端-高清屏下的1px边框-单独解决方式

Lin

Lin

xiaominglin789

1px像素问题的原因:

  • dpr = 物理像素 / css像素 普通屏幕的1px就是物理像素的1px,而Retina屏的1px就不等于1px了,这就造成了在不同设备中1px的实际宽度不一致的问题。

  • 如果需要对这个1px边框效果严格话,使用 pixel-border.css 解决
  • pixel-border.css是一个解决移动端 1px 边框的通用 CSS 工具。使用 transform 的解决方法,仅有几行的源码,使用起来非常方便,是目前发现最好的解决方法。

安装依赖 或 直接link引入

  • 1.npm安装:
npm install pixel-border --save
# yarn
yarn add pixel-border
  • 2.浏览器安装,建议安装压缩后的版本:
<link rel="stylesheet" href="path/to/pixel-border.min.css"><link>
  • 3.使用:
    • 在使用原生的 CSS 边框属性为原素设置边框,只需要在元素上添加一个 pixel-border 或 pixel-border="true" 的属性,并设置元素的 border-style 值即可
<div style="border-style: solid;" pixel-border>单像素边框</div>

前端-javascript-基础

Lin

Lin

xiaominglin789

Javascript 基础篇 - 一切基于对象

  • 1.JavaScript(通常缩写为JS)是一种高级的、解释型的编程语言。
  • 2.JavaScript 是一门基于原型函数先行的语言,是一门多范式的语言,它支持面向对象程序设计,命令式编程,以及函数式编程
  • 3.它提供语法来操控 文本数组日期正则表达式等,
  • 4.不支持I/O,比如网络存储图形等,这些都可以由它的宿主环境提供支持。
  • 5.它已经由ECMA(欧洲电脑制造商协会)通过ECMAScript实现语言的标准化。它被世界上的绝大多数网站所使用,也被世界主流浏览器(Chrome、IE、Firefox、Safari、Opera)支持。
  • 6.ECMAScript是JavaScript的规范,JavaScript是ECMAScript的实现

vue-img-require缘由

Lin

Lin

xiaominglin789

关于 vue-本地img require方式疑问

为何vue工程有时候在img中使用本地图片需要用require的方式? 有的项目却不需要?两眼一抹黑... 问号

2020-11-11-前端-vue 路由详解

Lin

Lin

xiaominglin789

vue-router 4.0 路由基础

vue-router Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。

  • 创建路由
  • 添加新的路由配置项
  • 删除现有的路由项
  • 动态路由与404的匹配
  • createRouter 可以设置3种路由模式
  • 全局路由守卫
  • 组件内的路由守卫API
  • 组件缓存、路由动画效果

前端-webpack-构建方案

Lin

Lin

xiaominglin789

webpack

webpack 是模块打包工具(构建工具), 作用:

  • 将js文件打包在一起
  • es6+ => es5
  • js 代码混淆
  • 资源文件内容: 格式化、去空格删注释、压缩
  • 各类资源打包成浏览器可以识别的jscssjpgpng