css
文章平均质量分 50
清风笑~
display:none
展开
-
前端style的git提交验证
才记录了javascript的git提交验证,接下来是style的提交验资以less为列子先安装dev依赖npm install --save-dev stylelint stylelint-config-prettier stylelint-config-standard项目根目录下创建.stylelintrc 文件{ "extends": ["stylelint-config-...原创 2020-05-01 16:59:10 · 1424 阅读 · 2 评论 -
移动端适配webpack配置px转rem或vh,vw
移动端适配常用百分比,rem,后来又多了一个vh,vw。当然在less,sass可以写计算规则来转换px,比较麻烦,打包一次搞定就好px转rem的配置安装依赖npm install px2rem-loader -D --save配置loadervar px2remLoader = { loader: 'px2rem-loader', options: { remUnit: 75...原创 2020-02-19 20:29:59 · 3201 阅读 · 0 评论 -
关于影子(shadow)DOM
经常写video,audio等html元素在带的控制条或者模块,但是这这些模块哪里来的用什么实现的发现步骤进入setttins, 在elements里勾选如此打开新世界的大门...原创 2019-12-12 22:41:16 · 2639 阅读 · 2 评论 -
webpack3升级到webpack4
webpack4出来有一段时间了,现在3升级到4运行npm i npm-check -gnpm-check -u选择要更新的依赖,loader之类都更新到最新npm i webpack-cli --save-devdev和prod 添加不同modeutils.js css 预编译处理 前缀于 loder配置, 生产打包使用MiniCssExtractPluginexpor...原创 2019-04-22 16:34:47 · 2989 阅读 · 0 评论 -
css3单位使用vh摆脱父级元素高度
在给元素设置高度时,一般使用px,但是当父类元素没有设置height时,子类设置height:*%,是没有高度的。main元素没有高度没设置,导致layout–1Ow-jP元素设置了高度为100%,也没有撑开,现有高度还是button元素的高度遇到这样的情况,只有从根元素开始html,body,root, main, layout--1Ow-jP { height: 100%}这样...原创 2018-11-27 17:31:58 · 1764 阅读 · 0 评论 -
vue-cli中 css3加前缀
看了在utils.js文件下添加修改//postcss: generateLoaders('postcss'),postcss:[require('autoprefixer')({ browsers: ['last 10 Chrome versions', 'last 5 Firefox versions', 'Safari >= 6', 'ie > 8'] })]或者pac...原创 2018-11-27 16:57:12 · 4019 阅读 · 1 评论 -
nginx配置多个前端项目
最近一台服务器要配置多个前端项目,当然前后端分离就需要nginx来配置了。单个项目还好说,如下 修改nginx的nginx.conf配置文件#user nobody;worker_processes 1;#error_log logs/error.log;#error_log logs/error.log notice;#error_log logs/error....原创 2018-09-06 15:40:23 · 27996 阅读 · 3 评论 -
小计最近踏的微信小程序的坑
最近做小程序,实在不想做。然后来吐槽下小程序的坑吧。也只做了这一个项目,有不对的地方请指正见谅。一、 tabbar app.json里配置tabbar是原生层的,所以要实现比价奇怪的tabbar只有自己用view写了,比如: 这样选中的按钮图标都超出了tabbar 的高度,只有的就自己定义一个组件吧<template name="tabbar">原创 2018-05-29 14:54:11 · 395 阅读 · 0 评论 -
ionic,angularjs,requirejs 结合开发 web
基本套路:1、先安装node,配置好npm config set cache 和npm config set prefix2、安装android sdk 和 java 配置环境变量3、执行npm 命令安装 npm install -g cordova 和 npm install -g ionic4、运行 ionic start app(名字随意) 生成如下运行 ion...原创 2016-07-26 15:14:51 · 4376 阅读 · 0 评论 -
关于iphone 上touch事件动态改变元素位置时与touch点发生偏移的问题
写这个么个题目好像,有点晦涩。直接来张gif图就知道,主要是是当手指触摸到元素时,元素的初始位置变成了left:0, top:0; js 设置监听事件 都是 一样的套路 touch.addEventListener('touchstart', function(evtend) {}, false);touch.addEventListener('touchmove', fu...原创 2017-04-18 14:52:26 · 2450 阅读 · 0 评论 -
gulp开发简单配置以及配合browserify应用
前端开发都需要对css ,js 打包压缩,less 编译,gulp简单的风格,可以完美的完成这项任务。首先需要安装gulpnpm install gulp -gnpm install gulp--save-dev安装gulp 需要的插件 如下npm install gulp-*** --save-devvar uglify = require('gulp-ug...原创 2017-01-28 23:22:26 · 1076 阅读 · 0 评论 -
初步学习 ionic css 布局
ionic.css 布局是基于flex的,虽然没有bootstrap那么丰富,但基本的布局还是满足的。提供了字体的图标,可以自定义颜色。还是能基本满足icon需求吧。。。当然还是需要自己定义很多css 或者 覆盖原来的。入门的写下,也不知道对不对。。。。。 <!DOCTYPE html><html><head> <meta char...原创 2016-05-30 11:15:23 · 1980 阅读 · 0 评论 -
水果手机 Safari transform rotateY 不兼容问题
移动端写css3 时 发现在safari 上 一个元素使用了 transform:rotateY(19deg); 显示有问题。 .class{ transform: scale(0.85) rotateY(10deg); -moz-transform: scale(0.85) rotateY(10deg); -o-transform: scale(0.85)...原创 2016-04-08 15:08:20 · 7841 阅读 · 1 评论 -
浅撸 css3 flex 布局
放假无聊,五行缺撸,索性就这么撸篇博客咯,聊以自慰。css3 中flex布局 即为弹性布局,在实现响应式,是非常好的。当然对于传统的position,float布局,如果完全只考虑移动端很大程度上能做到去float化了。但是pc端就不行,需要考虑到ie6,ie7,ie8。。。。具体看自己公司咯。这么要求,真像一个现代穿着比基尼的大胸女人,却还要要求她裹脚。。扯远了····flex是用在父元...原创 2016-02-06 19:22:59 · 4472 阅读 · 0 评论 -
css3 多行文本 溢出 省略号
css3 省略 多行省略原创 2015-10-06 22:02:01 · 12653 阅读 · 0 评论