最近在学vue开发，并且将学习笔记与大家一起分享，前面讲了vue环境的搭建：
基于vscode的Vue前端环境搭建问题及解决办法
还有vue的使用，重点就在webpack这个：
vue开发之webpack(一)(这个太重要，系列专讲)
vue开发之webpack(二)(webpack注释、ES6介绍)
vue语法块包括三部分：template、script、style，其中template就是页面的设计，这里也有分享：
vue开发之template(三)(标签属性介绍一)
还有vue全家桶其他部分的介绍：
vue全家桶之vue-router和vuex
vue template的介绍还有两节，即本系列的四和五，将在明后两天分享出来，因为平台的原因吧，就先不发出来了。今天先分享style语法块，即使用CSS进行页面布局，有兴趣的朋友欢迎学习整个系列。
01CSS样式
CSS 指层叠样式表 (Cascading Style Sheets)
样式通常保存在外部的 .css 文件中。
CSS声明总是以分号(;)结束，声明总以大括号({})括起来:
p {color:red;text-align:center;}
其中：p为选择器，color为属性id，red为值
CSS注释以 /* 开始, 以 */ 结束。
HTML元素以id属性来设置id选择器，CSS中id 选择器以”#”来定义，ID属性不要以数字开头。
class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。
class 选择器在HTML中以class属性表示, 在 CSS 中，类选择器以一个点”.”号显示。
.center {text-align:center; margin-left:20px}
注意：不要在属性值与单位之间留有空格
也可以指定特定的HTML元素使用class，如所有的 p 元素使用 class=”center” 让该元素的文本居中:
p.center {text-align:center;}
插入样式表的方法有三种:
外部样式表(External style sheet)——css文件内部样式表(Internal style sheet)——style标签内联样式(Inline style)——————–style属性优先级：内联>内部>外部>浏览器默认样式
02CSS背景
CSS 属性定义背景效果:
(1)background-color 背景颜色
body {background-color:#b0c4de;}
颜色：#ff0000或者rgb(255,0,0)或者red三种形式中的一个
三种颜色 红，绿，蓝的组合从0到255，一共有1600万种不同颜色(256 x 256 x 256)。
数年以前，当大多数计算机仅支持 256 种颜色的时候，一系列 216 种 Web 安全色作为 Web 标准被建议使用。其中的原因是，微软和 Mac 操作系统使用了 40 种不同的保留的固定系统颜色(双方大约各使用 20 种)。
我们不确定如今这么做的意义有多大，因为越来越多的计算机有能力处理数百万种颜色，不过做选择还是你自己。
最初，216 跨平台 web 安全色被用来确保：当计算机使用 256 色调色板时，所有的计算机能够正确地显示所有的颜色。
(2)background-image 背景图像
background-image 属性描述了元素的背景图像，默认情况下，背景图像进行平铺重复显示，以覆盖整个元素实体。
body {background-image:url(‘paper.gif’);}
(3)background-repeat设置平铺
background-repeat:no-repeat;不平铺background-repeat:repeat-x;水平平铺background-repeat:repeat-y;垂直平铺
(4)background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动。
(5)background-position 设置背景图像的起始位置
background-position:right top;属性可以简写如下：body {background:#ffffff url(‘img_tree.png’) no-repeat right top;}
来看一个设置背景图片的示例：
今天就先分享这么多了，明天继续说，欢迎关注，一起学习vue系列。最近持续更新中
因为本人的研究方向原来是C++，python语言，深度学习，计算机视觉，tensorflow框架，AI部署，图像处理等，所以本号有这些方向的分享。最近是因为有需要做一个前端项目，所以在自学vue前端开发，这里将学习的笔记分享出来给大家参考。后面还会分享有关图像处理与深度学习计算机视觉实战的内容~
举报/反馈