随笔分类 - 前端
摘要：复习： LESS是一门动态样式语言，.less文件最终要转换成.css文件LESS语言为CSS扩展了变量、混合、函数、判断等方面的特性，简化CSS样式文件的编写。 LESS语言的应用方法有两种： (1)在客户端直接使用.less文件 不推荐使用 <link rel="stylesheet/less"
阅读全文
摘要：Media Queries——媒体类型 随着科学技术不断的向前发展，网页的浏览终端越来越多样化，用户可以通过：宽屏电视、台式电脑、笔记本电脑、平板电脑和智能手机来访问你的网站。尽管你无法保证一个网站在不同屏幕尺寸和不同设备上看起来完全一模一样，但至少要让你的Web页面能适配用户的终端，让他更好的呈现
阅读全文
摘要：多列布局——Columns 为了能在Web页面中方便实现类似报纸、杂志那种多列排版的布局，W3C特意给CSS3增加了一个多列布局模块（CSS Multi Column Layout Module）。它主要应用在文本的多列布局方面，这种布局在报纸和杂志上都使用了几十年了，但要在Web页面上实现这样的效
阅读全文
摘要：变形--旋转 rotate() 旋转rotate()函数通过指定的角度参数使元素相对原点进行旋转。它主要在二维空间内进行操作，设置一个角度值，用来指定旋转的幅度。如果这个值为正值，元素相对原点中心顺时针旋转；如果这个值为负值，元素相对原点中心逆时针旋转。如下图所示： HTML代码： <div cla
阅读全文
摘要：属性选择器 在HTML中，通过各种各样的属性可以给元素增加很多附加的信息。例如，通过id属性可以将不同div元素进行区分。 在CSS2中引入了一些属性选择器，而CSS3在CSS2的基础上对属性选择器进行了扩展，新增了3个属性选择器，使得属性选择器有了通配符的概念，这三个属性选择器与CSS2的属性选择
阅读全文
摘要：background-origin 设置元素背景图片的原始起始位置。 语法： background-origin ： border-box | padding-box | content-box; 参数分别表示背景图片是从边框，还是内边距（默认值），或者是内容区域开始显示。 效果如下： 需要注意的是
阅读全文
摘要：text-overflow 与 word-wrap text-overflow用来设置是否使用一个省略标记（...）标示对象内文本的溢出。 语法： 但是text-overflow只是用来说明文字溢出时用什么方式显示，要实现溢出时产生省略号的效果，还须定义强制文本在一行内显示（white-space:
阅读全文
摘要：颜色之RGBA RGB是一种色彩标准，是由红(R)、绿(G)、蓝(B)的变化以及相互叠加来得到各式各样的颜色。RGBA是在RGB的基础上增加了控制alpha透明度的参数。 语法： color：rgba(R,G,B,A) 以上R、G、B三个参数，正整数值的取值范围为：0 - 255。百分数值的取值范围
阅读全文
摘要：圆角效果 border-radius border-radius是向元素添加圆角边框。 使用方法： border-radius:10px; /* 所有角都使用半径为10px的圆角 */ border-radius: 5px 4px 3px 2px; /* 四个半径值分别是左上角、右上角、右下角和左下
阅读全文
摘要：CSS3是什么 CSS3是CSS2的升级版本，3只是版本号，它在CSS2.1的基础上增加了很多强大的新功能。 目前主流浏览器chrome、safari、firefox、opera、甚至360都已经支持了CSS3大部分功能了，IE10以后也开始全面支持CSS3了。 在编写CSS3样式时，不同的浏览器可
阅读全文
摘要：####一、引入css js <link rel="stylesheet" href="js/ztree/css/ztree.css" type="text/css"> <link rel="stylesheet" href="js/ztree/css/zTreeStyle/zTreeStyle.c
阅读全文
摘要：Thymeleaf作为spring官方推荐的模板引擎，在spring体系中使用异常方便。这里以gradle构建的项目为例来说明。 首先，你要先修改build.gradle引入Springboot对Thymeleaf提供的依赖包。在dependencies中增加如下配置。 compile('org.s
阅读全文
摘要：规则01：尽量减少HTTP请求 前端优化的黄金准则指导着前端页面的优化策略：只有10%-20%的最终用户响应时间花在接受请求的HTML文档上，剩下的80%-90%时间花在为HTML文档所引用的所有组件（图片、脚本、样式表等）进行的HTTP请求上。因此，改善响应时间的最简单途径就是减少组件的数量，并由
阅读全文
摘要：* Ajax的增强操作 * jQuery对Ajax的支持 * 第一组：最基本的用法，最复杂 * $.ajax( url, [setting] )方法 * 第二组： * load( url, [data], [callback] )方法 * $.get( url, [data], [callback]
阅读全文
摘要：回顾第一天的内容： * Ajax的定义（不严格） * 客户端与服务器端之间进行交互，而无需刷新当前页面。 * 异步与同步： * 同步：客户端向服务器端发送请求，到服务器端进行响应，这个过程中，客户端不能做任何事情。 * 异步：客户端向服务器端发送请求，到服务器端进行响应，这个过程中，客户端可以做任何
阅读全文
摘要：Ajax: * Ajax概述: * Ajax的原理 * 什么是Ajax * 异步和同步 * 同步: * 客户端页面向服务器端发送请求，直到服务器端将响应发送回来，这个过程中，页面是不能做任何事情。 * 异步: * 客户端页面向服务器端发送请求，直到服务器端将响应发送回来，这个过程中，页面可以去做任何
阅读全文
摘要：基本方法扩充 get()：下标和length属性 outerWidth()：针对隐藏元素和参数true text()：合体的特例 remove()：detach() $()：$(document).ready() get()：就是把JQ转成原生的js $('#div1').innerHTML; //
阅读全文
摘要：选择网页元素 模拟CSS选择元素 $('#div1') //通过id获取元素 $('div') //通过标签获取元素 $('.box') //通过class名获取元素 独有表达式选择 :first 、:last、:eq()、:even、:odd <ul> <li></li> <li title="h
阅读全文
摘要：js的API不算太多，不熟悉的分别百度之。讲究的是全局观，没事时候就过过，熟记于心。1.全局对象值属性:NaNInfinityundefined函数属性:evalparseIntparseFloatisNaNisFinite处理URI的函数属性:decodeURIdecodeURIComponent
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>列表中的导航菜单应用</title> <style type="text
阅读全文
浙公网安备 33010602011771号