css滚动相关问题记录

1) 关于滑动加速优化,可以通过css进行处理例如,html如下: <div class="content-dialog"> <h1>活动规则</h1> <div class="content" id="content" v-bind:style="{ 'height': contentHeight + 'px' }"> <div class="j-title&…

一.相关问题记录: 1.对图表的div进行隐藏操作,使用hide()或display:none,重新展示时,会造成图表无法获取高度,导致图表的高宽不符合预期: 解决方法:最后调用一下resize()函数, 例如: var myCharts = echarts.init($('#id')[0]), myCharts.setOption(option) myCharts.resize(); 2.饼图的大小是有radius参数决定的.参数为字符串:百分比: -----------------…

{前端CSS} 语法 Css的几种引入方式 css选择器选择器的优先级 CSS属性相关背景属性边框 CSS盒子模型清除浮动 overflow溢出属性　　定位（position）z-index

前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染). CSS语法 CSS实例每个CSS样式由两个组成部分:选择器和声明.声明又包括属性和属性值.每个声明之后用分号结束. CSS注释 /*这是注释*/ CSS的几种引入方式行内样式行内式是在标记的style属性中设定CSS样式.不推荐大规模使用. <p style="c…

JavaScript 与 CSS 滚动实现最新指南

一些(网站)滚动的效果是如此令人着迷但你却不知该如何实现,本文将为你揭开它们的神秘面纱.我们将基于最新的技术与规范为你介绍最新的 JavaScript 与 CSS 特性,(当你付诸实践时)将使你的页面滚动更平滑.美观且性能更好. 大多数的网页的内容都无法在一屏内全部展现,因而(页面)滚动对于用户而言是必不可少的.对于前端工程师与 UX 设计师而言,跨浏览器提供良好的滚动体验,同时符合设计(要求),无疑是一个挑战.尽管 web 标准的发展速度远超从前,但代码的实现往往是落后的.下文将为你介绍一些常…

css 属性相关

css属性相关宽和高 width属性可以为元素设置宽度, height属性可以为元素设置好高度块级标签才能设置宽度,内联标签的宽度由内容来决定. 字体属性文字字体 font-family 可以把多个字体名称看做一个‘回退’系统来保存.如果浏览器不支持第一个字体, 则回尝试下一个. 浏览器会使用它可识别的第一个值. 简单实例: body { font-family: "Microsoft Yahei", "微软雅黑", "Arial", sa…

Vue-cli 多页相关配置记录

Vue-cli 多页相关配置记录搭建一个顺手的MPA项目脚手架,其实根据项目的不同目录结构和打包配置都可以进行灵活的调整.这次的项目可能是包含各种客户端和管理后台在一起的综合项目所以需要将样式和脚本做比较好的隔离.权限验证可以使用统一的模块,然后每个单独SPA中根据需求再单独实现数据或者功能权限的控制. 目录结构因为项目间的差异可能会比较大,所以除了基础的依赖以及一些通用的Service.其他模块之间需要做好隔离.每个Module 就是单独的一个SPA,可以拥有自己的一套 Styles,Ro…

ie6,ie7,ie8 css bug兼容解决记录

ie6,ie7,ie8 css bug兼容解决记录转载自:ie6,ie7,ie8 css bug兼容解决记录 - 前端开发断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决 ,也希望大家能在留言里面跟进自己发现的ie6 7 8bug和解决办法! 1:li边距“无故”增加任何事情都是有原因的,li边距也不例外. 先描述一下具体状况:有些时候li边距会突然增加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着…

介绍CSS的相关知识

以下是我跟大家分享的有关CSS的相关知识点: ①什么是CSS? css(Cascading Style Sheets)是层叠样式表 ②css的三种样式使用方法: 1,内联样式表:直接在html标签属性中设置期css样式,也可以称为行内样式. 例:<p style="color:red;"></p> 2,内嵌样式表(嵌入式样式表):在head头部中用<style></style>标签设置css的样式例:<style> p {…

纯css滚动视差

1.何为滚动视差视差滚动(Parallax Scrolling)是指让多层背景以不同的速度移动,形成立体的运动效果,带来非常出色的视觉体验. 作为网页设计的热点趋势,越来越多的网站应用了这项技术.效果如图: 一般而言,滚动视差在前端需要辅助 Javascript 才能实现.当然,其实 CSS 在实现滚动视差效果方面,也有着不俗的能力. 2.认识 background-attachment background-attachment:如果指定了 background-image ,那么 back…

piezo film 压电相关信息记录（2018-05-04 更新）

piezo film 压电相关信息记录起因需要使用 Piezo 做一些设计 http://www.te.com.cn/chn-zh/videos/transportation/piezo-film-and-energy-harvesting-theory-and-applications.html 相关 TE 长条的传感器资料:TODO http://www.piezofilms.com/applications.html 找到这篇文章,压电片测心跳: https://hackaday.com…

saltstack 开发相关命令记录

SALT API开发相关命令记录. 查看当前的salt key信息salt-key -L 测试被控主机的连通性salt '*' test.ping 远程命令执行测试salt '*' cmd.run 'uptime' 根据被控主机的grains信息进行匹配过滤salt -G 'os:Centos' test.ping 显示被控主机的操作系统类型salt '*' grains.item os 远程代码执行测试salt '*' cmd.exec_code python 'import sys; pri…

关于css布局的一点记录

1 关于css实现水平垂直居中的一些方法: .css的定位:用margin,padding,position position:absolute; //绝对定位,一般父级元素采用relative来配合使用,如果父级没有定位,将把body标签作为父级定位来使用用position和margin的方法来实现两个div盒子的水平垂直居中: html: <body> <div class="parent"> <div class="children&…

js中scroll滚动相关

js中scroll滚动相关 scroll,滚动,一般讨论的是网页整体与浏览器之间的关系. 一.元素相关属性/方法解释 element.scrollHeight 返回元素的整体高度. element.scrollWidth 返回元素的整体宽度. element.scrollLeft 返回元素左边缘与视图之间的距离. element.scrollTop 返回元素上边缘与视图之间的距离. 这四个属性,全部是只读属性其中,无非就是分为宽高和左上. 两个方向. 1.scrollHeight 和 sc…

CSS的相关知识——背景，超链接，列表，表格，奇偶选择器

接着上一篇总结一些css的相关知识㈠背景背景属性 1.background-color 背景颜色 rgb函数设置 2.background-image 背景图片 url(“logo.jpg”) 添加一个url函数,这个函数括号括起来,参数双引号之内带有的是添加成背景图片的这个图片的完整路径(相对路径)和文件名. 3.background-repeat 背景填充方式 (棋盘格的填充) ⑴取值为repeat,作为背景图片填充整个页面. ⑵取值为repeat-x,单向填充,横向填…

css滚动

css 滚动transform: translateY(-100px);jquery $(box).height(); //获取元素高度$(box).scrollTop();//获得元素的滚动条高度…

Yii2的相关学习记录，自定义gii模板和引用vendor中的js、css（四）

上文中后台模板框架已经搭建起来了,但还是有些不协调,像是有两个User标题,或者我们想自己在gii生成时添加或删除些公用的东西.这就需要我们定义自己的gii模板. 我们以CRUD的模板为例,默认的gii模板位置是在:vendor/yiisoft/yii2-gii/generators/crud的default目录下,我们当然可以在此新建一个和default并列的目录,但是并不推荐在这里新建,因为这里是vendor目录,正如上章所说的,vendor目录下的东西尽量不要去更改,这样你在git发布时或…

Yii2的相关学习记录，alert等美化、confirm异步、session中的flash及小部件的使用（六）

呃,系统自带的alert.confirm等弹出框实在是难看,作为一个颜控,这能忍? 这里我用的是kartik-v/yii2-dialog,这个是基于bootstrap3-dialog这个来做了一些常用alert.confirm和dialog的小部件封装,当然了,本质上还是bootstrap3-dialog,可以用原生的方法,原生方法的用法点这里,而bootstrap3-dialog又是基于bootstrap3的modals做的封装.嗯,基本关系就是这样.在搜索这个相关知识时,经常会看到有人提到b…

amazeui笔记-CSS 布局相关

CSS 等分网格: 说明:.am-avg-sm-2 数字表示几等分会将子元素 <li>的宽度设置为 50%. 只能用于 <ul> / <ol> 结构辅助类: 基本容器: .am-container 水平滚动: .am-scrollable-horizontal 内容超出容器宽度时显示水平滚动条. 垂直滚动: .am-scrollable-vertical 内容超过设置的高度以后显示滚动条,默认设置的高度为 240px. 浮动相关: .am-cf - 清除浮动…

Yii2的相关学习记录，前后台分离及migrate使用（七）

最近一直忙其它的(其实是懒!),将<深入理解Yii2>看了一遍,一些当初没明白的稍微明了了点,然后又看yii2的图片上传等处理.富文本.restful什么的,但由于没进行到这里,只看也不管用啊,所以还是按照步骤一步步来,先说说前后台分离.(其实普通的内容管理站点用不着下面所说的彻底分离什么的,看看也无妨) 个人感觉前后台的情况有这么几种,首先是前后台是否是用一个验证体系,其次是前后台是否共用一个数据表.一般来说下面三种比较常用吧: A.共用一个验证体系和一个数据表. B.两个验证体系和共用一个…

Yii2的相关学习记录，初始化Yii2（二）

前面已经将Yii2下载下来了,那我们就需要能实际的使用. 一.初始化,因为我都是在windows系统下,所以用cmd命令打开下载下来的Yii2的根目录.然后运行下面命令: init 会提示选择0为开发环境,1为生成环境.一般选生产环境.后期可以同样输入此命令来切换开发环境和生产环节,但是需要注意切换时需要提前在“environments”目录中中提前写好生产环境的配置,以免切换时覆盖丢失配置项,后面还会说,现在继续往下走. 二.配置数据库,现在前台访问地址为:http://localhost/v…

Yii2的相关学习记录，下载Yii2（一）

原先学习过Yii1的相关知识,虽然也是半懂不懂的,但稍微的结构是了解的.现在利用晚上的时间学习下Yii2的使用,打算建一个后台管理系统,这里记录下,以免自己以后忘记. 目前已看一部分Yii2的权威指南,虽然Yiiframework中文网站的权威,跟英文版本比较有些章节缺失内容,但也能大体了解具体能做什么,用到某功能时再仔细看,当然英文好的还是建议看英文版本的,比较新,比较全.顺便看了慕课网上的“与Yii框架不得不说的故事”系列视频,讲的非常不错. 还有比较重要的是需要FQ用google,毕竟是国…

Webpack 2 视频教程 011 - Webpack2 中加载 CSS 的相关配置与实战

原文发表于我的技术博客这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲解的. 这个基本就是目前国内最好的 Webpack 2.0 最好的学习视频了,希望可以对新手或者复习相关知识的朋友有用. 原文发表于我的技术博客 Webpack 是当下最热门的前端资源模块化管理和打包工具.它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源.还可以将按需加载的模块进…

css 滚动视差之水波纹效果

核心属性: background-attachment 这个属性就牛逼了, 它可以定义背景图片是相对视口固定, 还是随着视口滚动, 加上这个属性网页瞬间就从屌丝变成高大上. 我们来看个例子: html: <div class="attach view"></div> <div class="text view">I WANT FLY</div> <div class="attach view"…

不可思议的纯 CSS 滚动进度条效果

结论先行,如何使用 CSS 实现下述滚动条效果? 就是顶部黄色的滚动进度条,随着页面的滚动进度而变化长短. 在继续阅读下文之前,你可以先缓一缓.尝试思考一下上面的效果或者动手尝试一下,不借助 JS ,能否巧妙的实现上述效果. OK,继续.这个效果是我在业务开发的过程中遇到的一个类似的小问题.其实即便让我借助 Javascript ,我的第一反应也是,感觉很麻烦啊.所以我一直在想,有没有可能只使用 CSS 完成这个效果呢? 分析需求第一眼看到这个效果,感觉这个跟随滚动动画,仅靠 CSS 是不可能…

CSS属性相关

·一.宽和高 width属性可以为元素设置宽度. height属性可以为元素设置高度. 块级标签才能设置宽度,内联标签的宽度由内容来决定. 二.字体属性 1.文字字体 font-family可以把多个字体名称作为一个‘回退’系统来保存.如果浏览器不支持第一个字体,则会尝试下一个.浏览器会使用它可识别的第一个值. 简单实例: body { font-family: "Microsoft Yahei", "微软雅黑", "Arial", sans-s…

java 项目相关学习记录

一位资深程序员大牛给予Java初学者的学习路线建议 [任何时期都可以好好看看] https://www.imooc.com/article/8993 https://www.jianshu.com/p/4f1c7badd6a9 [java书籍] Java编程语言(第三版)---Java四大名著----James Gosling(Java之父) Java编程思想(第4版)----Java四大名著----------------Bruce Eckel JAVA 2核心技术卷I:基础知识(原书第8…

CSS marging相关

一.margin可以为负值在盒模型中,内容区的width/height.padding.border都不能为负值,但是margin例外,它可以为负值. margin负值的本质,在于它改变了元素在普通流中所占据的空间. 关于margin负值的使用技巧,了解不多,日后有机会再补充,此处先贴三个经典应用. 1. margin-left负值结合浮动实现不改变DOM结构的流体布局. <!DOCTYPE html> <html> <head> <meta charse…

iOS上架被拒理由及相关解决方案记录

注:苹果客服中国区电话:4006 701 855 最近公司上线一个电动车工具类项目,被拒无数次,今天上架了,记录一下 01 苹果拒绝理由(内购和后台定位) We noticed that your app offers a subscription with a mechanism other than the in-app purchase API.Please see attached screenshots for details. Next Steps To resolve this i…

css样式继承经验记录

与元素(文字颜色.字体等)相关的样式默认会被继承: 与元素在页面上的布局相关的样式默认不会被继承: <body> <p>I like <span>aplles</span> and oranges.</p> </body> <style type="text/css"> p { color: white; background: grey; border: medium solid black; } &…

ElasticSearch：华为云搜索CSS 之POC操作记录

2019/03/06 09:00 ES文档官方:https://support.huaweicloud.com/usermanual-es/es_01_0024.html 华为云区域:华北北京1 ES集群控制台:地址: https://console.huaweicloud.com/elasticsearch/?agencyId=3cc665d122c14417bb30d6ac8d5588d4&region=cn-north-1&locale=zh-cn#/es/management/li…