CSS是层叠式样式表,主要用来控制页面的样式. 一.CSS概述 应用CSS: 1.外部样式表,CSS写在一个单独的.CSS文件中,在head里加<link rel="stylesheet" tpye="text/css" href="路径及名称"> 2.内部样式表,写在html的head的style标签中 3.内联样式表,直接写具体标签上,<h1 style="color #FFF">ddd</h…
初学css,记录下初学者需要注意的事项. 一.css 代码风格 1.css 命名语义化. 如类名: main   主体   container 内容 footer    站底 right.center.left   位置 如文件名: base.css(css reset)  站点通用 theme.css  主题 2.一律小写,不要有下划线,中线 3.css 属性按照首字母顺序排列 4.css 属性组织模块化,添加适当注释 5.一致性,方便阅读和维护 二.初学者布局误区 网页设计不只是”DIV+C…
说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid app的开发,都用到了css3技术,在css3中,新增了许多单位,rem.vw和vh.vmin和vmax.ch和ex等等,那现在对这些单位分别做一下详细的介绍吧. 1.em 做前端的应该对em不陌生,不是什么罕见的单位,是相对单位,参考物是父元素的font-size,具有继承的特点.如果字体大小是16…
说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid app的开发,都用到了css3技术,在css3中,新增了许多单位,rem.vw和vh.vmin和vmax.ch和ex等等,那现在对这些单位分别做一下详细的介绍吧. 1.em 做前端的应该对em不陌生,不是什么罕见的单位,是相对单位, 这种技术需要一个参考点,一般都是以<body>的“font-siz…
一.基本语法-let命令 (1)ES6新增了let命令,用来声明变量.所声明的变量,只在let命令所在的代码块内有效. 循环的计数器,就很合适使用let命令.计数器i只在for循环体内有效,在循环体外引用就会报错. 另外,for循环还有一个特别之处,就是设置循环变量的那部分是一个父作用域,而循环体内部是一个单独的子作用域. (2)不存在变量提升 var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined. 为了纠正这种现象,let命令改变了语法行为,它所声明的变量一定要在…
始终居中: width: 300px; position: fixed; /*在可视区域的上下左右居中*/ top: calc(50vh - 200px); left: calc(50vw - 150px); 二分之一圆的边: border: 1px solid #fff; position: absolute; width: 30px; height: 60px; border-width: 1px 0px 1px 1px; border-radius: 30px 0 0 30px; top:…
1.css类选择器中的类名的第一个字符不能是数字,无法再Mozilla或Firefox中起作用. 2.css中id选择器中的属性只能在每个html文档中出现一次. 3.css样式表中不需要在属性值与单位之间留有空格,在Netscape和Mozilla/Firefox中不起作用. 4.css背景属性(背景属性不能继承): (1)background 简写属性,可以将一下所有属性设置放在一个声明中. (2)background-image:url() 设置图像背景 (3)background-col…
类似于grunt,都是基于Node.js的前端构建工具.不过gulp压缩效率更高. 工具/原料 nodejs/npm 方法/步骤 首先要确保pc上装有node,然后在global环境和项目文件中都install gulp npm install gulp -g   (global环境) npm install gulp --save-dev (项目环境)     在项目中install需要的gulp插件,一般只压缩的话需要 npm install gulp-minify-css gulp-con…
CSS (Cascading Style Sheets) 是用来样式化和排版你的网页的 —— 例如更改网页内容的字体.颜色.大小和间距,将内容分割成多列或者加入动画以及别的装饰型效果. CSS是什么 CSS是一种用于向用户指定文档如何呈现的语言 — 它们如何被指定样式.布局等. 文档通常是用标记语言结构化的文本文件 — HTML 是最常用的标记语言, 但你依然可以遇见一些其他的标记语言,比如 SVG 或者 XML. CSS如何影响HTML Web浏览器将CSS规则应用于文档以影响它们的显示方式.…
行内元素与块级元素直观上的区别 1.行内元素会在一条直线上排列,都是同一行的,水平方向排列块级元素各占据一行,垂直方向排列.块级元素从新行开始结束接着一个断行. 2.块级元素可以包含行内元素和块级元素.行内元素不能包含块级元素. 3.行内元素与块级元素属性的不同,主要是盒模型属性上行内元素设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效 行高决定行内元素的上限(即margin-top和padding-top的设置是否显示出来),…