HTML+CSS
关注
分享
扫一扫
HTML+CSS
晴天有点孤单
等风来，不如追风去
展开
-
H5 移动端 保存图片到本地 + 图片预览
动态创建A链接，添加download属性和href属性，并触发点击事件。动态创建A链接，添加href属性，并触发点击事件。原创 2022-12-28 11:44:08 · 2065 阅读 · 1 评论 -
IOS底部安全距离适配问题
ios兼容问题原创 2022-07-13 10:09:33 · 949 阅读 · 0 评论 -
CSS使用 REM布局
在入口文件新增自执行函数_initFontSize:function (){ document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px'; },监听窗口变化window.addEventListener('resize',_initFontSize,false);})();UI配置 100px == 1rem页面使用header {.原创 2021-07-08 17:52:26 · 332 阅读 · 0 评论 -
原生js获取手机定位信息 geolocation
function Location() {};Location.prototype.getLocation = function (callback) { let options = { enableHighAccuracy: true, maximumAge: 1000 }; this.callback = Object.prototype.toString.call(callback) == "[object Function]" ? callback :原创 2020-12-02 11:43:54 · 2819 阅读 · 0 评论 -
css 文本 两端对齐
display: inline-block; text-align: justify; vertical-align: top; text-align-last: justify;效果图如下原创 2020-06-02 09:34:09 · 284 阅读 · 0 评论 -
前端常用字典 （html+css）篇
1.1 水平居中 1.1.1 行内元素 （父元素）text-align，（子元素）inline-block .parent{text-align:center} .child{display:inline-block} 1.1.2 块状元素 使用margin:0 auto来实现 .parent{} .child{width:20...原创 2018-12-28 18:26:28 · 4617 阅读 · 0 评论 -
css + iview 加载动画
html<template> <div class="loading"> <Spin class="img"> <Icon type="load-c" size=38 class="demo-spin-icon-load"></Icon> &l原创 2018-08-20 16:38:39 · 3451 阅读 · 2 评论 -
基于vue+iview 时间选择插件封装处理
不定期更新<template> <div style="position: relative;display: inline-block;"> {{label}} <Date-picker v-model="params.startTime" @on-change="handleChangeStart" type="date" pl原创 2018-07-27 20:27:24 · 1305 阅读 · 0 评论 -
vue vscode 保存时自动验证eslint规则格式化代码
在vscode setting.json中添加如下配置希望大家快乐开发，另外vscode的git扩展功能也是不错的哦，改天再给大家分享"eslint.validate": [ "javascript", "javascriptreact", { "language": "htm原创 2018-05-30 19:56:09 · 6492 阅读 · 0 评论 -
ES6 Promise 用法讲解
Promise是一个构造函数，自己身上有all、reject、resolve这几个眼熟的方法，原型上有then、catch等同样很眼熟的方法。如下代码var pTest = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){ console.log('执行完成');...转载 2018-05-30 19:27:12 · 229 阅读 · 0 评论 -
vue 动画
<template><div class="box"> <h1>vuejs之css过渡与css动画</h1> <p class="p"> 过渡的类名 在进入/离开的过渡中，会有 6 个 class 切换。 <br>v-enter：定义进入过渡的开始状态。在元素被插入之前生效原创 2018-05-30 19:03:11 · 607 阅读 · 0 评论 -
网页标题图片
添加下面标签即可原创 2017-09-03 17:55:16 · 740 阅读 · 1 评论 -
修改网页内容，随心所欲改变网站显示内容
javascript:document.body.contentEditable=’true’;document.designMode=’on’;void o然后回车，你就可以随心所欲的修改这个网站啦！输入如下代码，将退出编辑状态！javascript:document.body.contentEditable=’false’;document.designMode=’on’;void o原创 2017-09-03 17:55:54 · 31877 阅读 · 11 评论 -
前端开发的一些规范
转载整理一些前端开发规范文档这份文档已经写了差不多一年了，最近也更新过了，作为一个有组织和纪律的团队，规范是必须的，毕竟每个coder都有自己的一套风格和规范，为了以后团队的和谐发展，结合前端业界的开发经验，故而写出了一个相对是大而简洁的文档，希望能够对你也有所启发。下面简要的摘录我的文档，详细的可以在本文底部下载PDF文档。第一部分：文件规范tpl, css, js, img文件均归档至<系统开转载 2017-09-03 17:53:37 · 2514 阅读 · 0 评论 -
localstrage
HTML5中提供了localStorage对象可以将数据长期保存在客户端，直到人为清除。 localStorage提供了几个方法: 1、存储：localStorage.setItem(“key”,value) 如果key存在时，更新value2、获取：localStorage.getItem(key) 如果key不存在返回null3、删除：localStorage.removeItem(ke原创 2017-09-03 17:50:09 · 487 阅读 · 0 评论 -
flex用法
Flex布局新旧混合写法详解（兼容微信）flex是个非常好用的属性，如果说有什么可以完全代替 float 和 position ，那么肯定是非它莫属了（虽然现在还有很多不支持 flex 的浏览器）。然而国内很多浏览器对 Flex 的支持都不是很好，这里针对微信内置浏览器写了一套兼容写法。下面入正题。首先还是从两个版本的语法开始讲吧，这里还是假设flex容器为 .box ，子元素为 .item 。旧语原创 2017-08-15 16:57:25 · 507 阅读 · 1 评论 -
C3伪类选择器
E:nth-of-type(n) { sRules }匹配同类型中的第n个同级兄弟元素E。 要使该属性生效，E元素必须是某个元素的子元素，E的父元素最高是html，即E可以是html的子元素，也就是说E可以是body 该选择符总是能命中父元素的第n个为E的子元素，不论第n个子元素是否为E 有一点需要注意的是： HTML示例代码： 第1个p 第2个p 第1原创 2017-08-17 09:05:15 · 1595 阅读 · 2 评论 -
网页标题图片以及原生h5+C3轮播
网页标题图片 h5+c3轮播 <head> <meta charset="UTF-8"> <title></title> <style> section { width: 430px; height: 440px; overflow: hidden; }原创 2017-08-17 08:54:43 · 504 阅读 · 1 评论 -
meta标签的方法
HTMl中Meta标签详解以及meta property=og标签含义meta是用来在HTML文档中模拟HTTP协议的响应头报文。META标签是HTML语言HEAD区的一个辅助性标签，它位于HTML文档头部的标记和标记之间，它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie；它可以用于鉴别作者，设定页面格式，标注内容提要和关键字；还可转载 2017-08-17 08:48:08 · 280 阅读 · 1 评论