阿年的博客

Nginx安装及启动解压安装包： tar -zxvf nginx-1.18.0.tar.gz检查当前服务器上是否安装C/GCC编译器 gcc --version如果出现版本信息即说明已经安装，否则需要安装： yum -y install gcc安装所需的依赖环境： yum -y install pcre pcre-devel #为了重写rewrite yum -y install zlib zlib-devel #为了gzip压缩 yum -y install open

IDEA中配置less自动编译先大概了解一下流程，对配置有个整体的把握。安装node.js安装lessIDEA中安装Node.js插件IDEA中添加less组件IDEA中安装File Watchers插件配置File Watchers1.安装node.js直接去官网下载node.js，然后傻瓜式安装。要验证是否安装成功，直接在cmd命令行中输入如下命令： node -v npm -v出现安装版本信息即为安装成功：2.安装less在命令行中输入如下命令

C3中的各种转换详解目录转换2D转换移动旋转2D转换的中心点缩放2D转换的复合写法3D转换移动透视旋转3D呈现转换（transform）转换( transform )是CSS3中具有颠覆性的特征之一，可以实现元素的位移、旋转、缩放等效果。转换通常要和过渡（transition）搭配使用，这样的转换更具有连续性，观赏性更强。属性：移动：translate旋转：rotate缩放：scale分类：2D转换3D转换2D

C3动画及常用属性动画的制作步骤：定义动画调用动画一、定义动画定义动画用keyframes关键字。 @keyframes 动画名称 { /* 动画开始时的状态 */ 0% { height: 50px } 50% { height: 70px } /* 动画结束时的状态 */ 100% { height: 100px } }其中 0% 50% 100% 被称为动画序列。二、调用动画

CSS3中的过渡CSS3中新增了一个过渡属性，它使得我们可以在不使用flash动画或者Javascript的情况下，当元素从一种样式变换为另一种样式时为元素添加过渡效果。这种过渡是从一个状态渐渐的过渡到另外一个状态。过渡最简单的使用是和hover一起搭配使用。它的语法为： transition: 要过渡的属性 花费的时间 运动曲线 开始时间;参数说明： 参数 解释 要过渡的属性（必须写）

HTML字符实体在HTML页面中，有一些特殊的符号我们想使用，但是呢又不方便直接使用，那么我们就可以用一些实体名称来代替。注： 实体名称对大小写敏感。 特殊字符 描述 实体名称 【空格】 空格   【Tab键】 Tab键   > 大于号 &amp

CSS3新特性-结构伪类选择器在CSS3中新增了一个结构伪类选择器，它能用更加简洁的代码，实现我们的某些需求。定义：结构伪类选择器主要根据的是文档的结构来选择元素，常常用在根据父级选择器选出某些想要的子元素。主要语法如下： 编号 语法 含义 1 E:first-child 匹配父元素中的第一个子元素E 2 E:last-child

CSS的高级用法有时我们在开发中会遇到如下的需求：观察上面的图片，我们看到第一张图片手机京东下面有一个凸出盒子的三角形；第二张图片红色和白色有个斜线分割，那么我们怎么实现这种效果呢？看完这篇博客，别说你还不会！！！CSS制作三角形首先我们平常见到的盒子都是这个样子的。代码实现： .box1 { width: 100px; height: 100px; border: 1px solid red; margin: 100px auto; }我们

CSS中的定位详解及扩展定位分类静态定位（static）相对定位（relative）绝对定位（absolute）固定定位（fixed）粘性定位（sticky）定位的叠放次序（z-index）定位拓展一、静态定位（static）语法： 选择器 { position: static; }含义：静态定位按照标准流的特性摆放位置，没有列偏移（top,bottom,left,right）在布局时很少用到。二、相对定位（relative）语法： 选择器 { pos

CSS中的常用复合写法表格常用属性字体属性的复合写法背景图片的复合写法边框的复合写法内边距（padding）的复合写法外边距（margin）的复合写法 一、表格常用属性： 属性 含义 cellpadding="5px" 表格内容和单元格边缘之间的距离为5px cellspacing="0" 单元格之间的距离

清除浮动为什么要清除浮动当父盒子没有设置高度（为了后期维护和扩展，不方便设置高度）,而父盒子里面的子盒子浮动了，此时，影响了下面的布局，我们就应该清除浮动。清除浮动是为了清除浮动元素脱离标准流后对后续标准流造成的影响。清除浮动的策略闭合浮动.只让浮动在父盒子内部影响,不影响父盒子外面的其他盒子。清除浮动的方法额外标签法。父级元素添加overflow属性。:after伪元素法。双伪元素清除浮动（推荐使用）。一.  额外标签法额外标签法也称为隔墙法，是W

设备的屏幕像素比屏幕像素比（Device Pixel Ratio ，DPR），实际上指的是window.devicePixelRatio ,被所有webkit浏览器以及opera所支持， 它是一个比值，既然是一个比值那他是怎么算出来的呢？其实就是用物理设备的像素/css像素。举例来说：假如一个手机的像素是640x960而css像素为320x480，那么它的屏幕像素比为2。在浏览器中的Console中可以查看当前网页的屏幕像素比。在Console中输入window.devicePixelRatio

列偏移：在利用栅格系统进行开发的时候，我们有时候不想让其中的两列或者多列紧挨，而是列与列之间有一定的距离，所以就可以用列偏移来实现，而且这样实现的间距是动态的，不会像写死的margin那样，不会随屏幕的变化而动态改变。Bootstrap文档中是这样解释的：使用 .col-md-offset-* 类可以将列向右侧偏移。这些类实际是通过使用 * 选择器为当前元素增加了左侧的边距（margin）。例如，.col-md-offset-4 类将 .col-md-4 元素向右侧偏移了4个列（column）的

媒体查询：什么？这TMD超乎我想象啊！看着屏幕我陷入了沉思。为什么是大于的时候才会执行呢？废话不多说，上正菜。在做一个需求的时候遇到一个问题，大概意思是：当屏幕宽度大于某个值的时候，要为容器指定一个高度。要求简单，也很容易理解，但是当我看到这段代码的时候还是陷（发）入（出）了沉（猪）思（叫）。@media (min-width: 768px) { #main_id > .carousel-inner > .item{ height: 410px; }}不知道小伙伴们看到