WangMin@汪末末

CSS中的行高（line-height）是指网页中每行文字之间的距离，就是对于同一行内的不同内容，行高决定它们之间的间距。换一句话来说，在CSS中包括文字的每一行不是只有文字的高度，其实还有上间距、下间距，所以行高指的是文字的高度+上下间距。合理设置文字行高不仅能够让网页更加美观与整洁，还能够增加用户的视觉与阅读体验，在大段文字中，合适的行高可以让用户阅读起来更加舒适。你可能还是不明白行高是什么？下面我通过几图来仔细给大家讲一下吧！

CSS空白现象就是非常常见的问题之一，虽然它已经被发现很久，但仍然有许多新手和经验丰富的开发者们忽略了它对页面布局的影响。我们一起来看看吧！

CSS 所有的HTML 标签元素在网页中都生成了一个描述该元素在HTML文档布局中所占空间的矩形框，我们可以形象地将它看作是一个盒子，它会把各种html元素按照设计需求包裹起来，将html元素进行封装，就组成了各式各样好看的网页。简单一点来说，页面中的每一个标签，都可以看作是一个盒子，通过盒子的视角我们可以更直观地进行网页排版布局.

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin在项目中为了网页的美观，通常会给网页或者某个元素设置背景，这时就会用到 CSS中background属性 来实现这个效果，这个属性是一个很基本的而且比较常用的样式 ，那么应该怎样来运用这个属性呢？一起来看看吧！！！background的属性的语法格式background的属性可以通过以下的参数来实现背景效果：background : background-color || backgroun

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin众所周知 margin属性 是用来声明当前所设置或者指定元素所有外边距的宽度，或者设置各边上外边距的宽度。一直以来我认为它是一个很简单的属性，但是在最近的所做的项目中我遇到了一些关于 margin属性 所涉及到的问题，下面就给大家分享一下吧！！margin 属性的简单概述说到 margin 属性 ，就必须先了解 css盒子模型（Box Model） ，因为css盒子模型是用来设计和布局的，本

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin随着前端技术的发展，单一的背景色已经满足不了客户的需求了，所以在前端开发中我们常常会用到一些渐变色的效果，这样可以使前端页面更加美观。那么渐变色的效果到底是怎么来的？我们应该怎么做才能实现这一效果呢？接下来就一起来看看吧！实现原理css要实现渐变，就必须使用渐变函数 linear-gradient（） 来设置 background 或 background-imge 属性。那么 lin

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin关于box-shadow属性，有的小伙伴可能用的时候直接复制已有的，并没有仔细了解过box-shadow属性的参数分别是什么含义，最后导致阴影的样式不能按照自己的需求自由控制，让自己感到很苦恼。接下就一起来好好学习这个属性吧！！以上仅是个人见解，若有不足之处欢迎在下方评论指出，那就先分享到这里!! ???? 后续继续更新!!...

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin你是否还在用图片制作三角形和剪头吗？那就太out了。css可以轻松绘制出你想要的三角形与箭头，而且颜色大小可以随意改变，还不用担心失真等问题。那就一起来看看吧！！实现原理首先来看看当我们给元素添加border时，border的样子。假设代码如下：<div class="box"></div>.box{ width:100px; height:100p

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin在项目中，大部分前端程序员都没有按照良好的CSS书写规范来写CSS代码，每次写css样式都是用到什么就在样式表后添加什么，完全没有考虑到样式属性的书写顺序对网页加载代码的影响。后来逐渐才知道正确的样式顺序不仅易于查看，并且也属于css样式优化的一种方式。下面就开始学习吧！！各种类型属性的书写顺序及作用书写顺序优先级第一定位属性：position display float left

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin在讲CSS 选择器权重计算与优先级之前，我们先来了解一下CSS是用来干什么的？CSS是用来通过添加样式使网页更加美观，也就是说CSS是利用选择器来美化网页的，使用户可以在网页上更清晰地找到自己需要的东西。CSS添加样式的方式：有内部样式（内部样式就是在html文件中通过标签来添加样式）外联样式（通过标签将外部的样式css文件引入到html文件中）还有行间样式，即在元素标签中通过styl

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin我们在项目开发的过程中也许都遇到过这样的问题：我们需要实现这样一个需求，在一个父级元素中隐藏一个可能过长的文本。而这个需求可以分解为两个，一个是单行溢出省略，一个是多行溢出省略。下面我们就开始一起学习吧！实现文本超出显示省略号的常见属性1）overflow: hidden这里我们需要注意到一点：这里的overflow并不是设置为父级元素div的属性，而是给需要文本省略的标签的属性，需要和o

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin在CSS中，如果给一个盒子设置了固定的宽度与高度，但内容过多就会溢出盒子本身的宽度或高度。此时，就可以使用 overflow 属性来控制内容溢出时的处理方式。那么接下来就开始来学习这个属性吧！overflow 属性值如下：属性值含义visible不剪切形式也不添加转动条，也就是元素的内容在元素框之外也可见auto如果内容被剪裁，则浏览器会显示滚动条以便查看其余的

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin网页上的每个元素都是一个矩形框。CSS中的display属性决定了矩形框的行为。display属性是我们在前端开发中常常使用的一个属性。display的属性值如下：属性值含义block块对象的默认值。用该值为对象之后添加新行none隐藏对象。与visibility属性的hidden值不同，其不为被隐藏的对象保留其物理空间inline内联对象的默认值。用该

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin对于颜色相信大家都很敏感，眼睛所见之处都存在颜色，那在css中我们用什么来表示颜色呢？CSS 中的颜色有三种定义方式：使用颜色方法（RGB、RGBA、HSL、HSLA)，十六进制颜色值和预定义的颜色名称。我们常使用的是RGB与RGBA。那我们就来说一下它们之间的区别吧！rgb与rgba的含义RGB 是代表Red（红色） 、Green（绿色）、 Blue（蓝色）三个单词的缩写。RGBA 颜色值

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin国内的设计师大都喜欢用px，而国外的网站大都喜欢用em和rem，那么三者的区别与优势是什么？接下来我们就来学习一下吧！单位px、em、rem分别表示什么？1、 px(Pixel) 相对于显示器分辨率而言，表示“绝对尺寸”（并非真正的绝对），实际上就是css中定义的像素（这里的像素与设备的物理像素有一定的区别），利用px设置字体大小及元素宽高等比较稳定和精确。px的特点如下：IE无法调整

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin对于所有定位，最后都不免遇到两个元素试图放在同一位置上的情况。显然，其中一个必须遮住另一个。但是如何控制哪个元素放在上层，这就出现了z-index这个属性。z-index属性的含义一个元素在文档中的层叠顺序，用于确认元素在当前层叠上下文中的层叠级别。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。z-index的属性值越高越靠前。元素可拥有负的 z-index 属性值。z-i

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin在开发过程中，很多网页需求要求我们居中一个div，比如html文档流当中的一块div，比如弹出层内容部分这种脱离了文档流等。不同的情况有不同的居中方式，接下来就分享下一下几种常用的居中方式。1、margin:0 auto 水平居中也就是将margin-left和margin-right属性设置为auto，从而达到水平居中的效果。前提：已设置width值。HTML:<div class

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin在讲几种定位方式之前，我们先来了解一下什么是普通流(normal flow)？除非专门指定，否则所有框都在普通流中定位。普通流中元素框的位置由元素在(X)HTML中的位置决定。块级元素从上到下依次排列，框之间的垂直距离由框的垂直margin计算得到。行内元素在一行中水平布置。position 属性的作用position 用于定位盒子对象，有时一个布局中几个小对象，不易用css paddin

作者:WangMin格言:努力做好自己喜欢的每一件事优快云原创文章博客地址 ???? WangMin什么是浮动 float？标准流：盒子会各占整行位置。子盒子若是标准流，父盒子虽然没有高度，但是会撑开父盒子高度。浮动：盒子浮了起来，不会占据原来的位置，若父盒子没有定义高度，则不会撑开父盒子，父盒 子高度为0。（浮动可以让多个块级元素在一行显示，且块与块之间没有空隙，但要注意给父盒子清除浮动，否则父盒子不会被撑开）。div配合float浮动来做页面的布局，浮动最常用的地方就是用来做布局。只要