低代码是一种使用拖拽可视化开发的工具，使用低代码可以提高软件的开发效率和开发质量。作为小白要想熟练的使用低代码工具一些基础的知识如html、css、javascript是必不可少的。如果直接去学习基础知识学习周期长，而且学完不一定能将所有知识应用到开发中来。为了降低小白学习低码的难度缩短学习周期，特此制作了本系列的基础教程。
教程准备分成几个部分，上篇准备结合组件介绍CSS的语法知识，下篇结合低代码介绍javascipt的基础知识。学习完这两篇后就具备了一定的前端开发能力，基本上可以搭建常见的各类页面。
什么是CSS
css叫层叠样式表，主要是控制页面的显示效果，如字体大小、颜色、布局等。在传统开发中我们会将样式单独写到一个后缀为.css的文件中，页面通过引入样式文件来达到页面的渲染效果。
不同于传统开发，低码中我们的样式是定义在style的目录中，只要定义好即可在页面上进行引用
在这里插入图片描述低代码中分为全局样式和局部样式，全局样式一般定义文字的整体大小比如字号，字体，局部样式会根据页面的显示效果不同做具体的定义。
CSS语法
css的语法一般包括一个名字和里边具体的内容，具体语法如下：
代码语言：txt复制h1 {
color:red;
font-size:16px
}我们在这里定义了一个h1标题的样式，有两个属性，分别是颜色和字体大小。那在低码里是如何设置的呢？
低码中的样式一般是和组件相关的，我们在组件库里选择不同的组件，然后具体的给组件设定样式。
在这里插入图片描述低码中支持两种模式进行样式的设置，一种是直接通过可视化的方式进行设置，另外一种也支持代码编制
在这里插入图片描述切换到代码模式后，我们就可以按照CSS的语法进行代码的编制
在这里插入图片描述怎么查找CSS支持的模块
CSS里有很多模块，如字体、布局等，内容非常多，而且也在不断的更新，那日常我们要怎么掌握呢？我的建议是用好MDN。MDN是个宝库，里边介绍的非常清楚。比如我想学习一下CSS是如何设置字体的，我可以在百度里搜索MDN 字体
在这里插入图片描述
在这里插入图片描述里边就是一篇长长的文章介绍字体的，需要仔细阅读。有很多初学的小伙伴看到这么长的教程就有点犯愁，能学会吗？没办法，计算机作为一门学科本身就很复杂，想要简简单单学会是不可能的。
先学习教程，学完就需要进行练习，只有循环往复才能真正掌握开发这门技巧。
实战讲解
好了，讲了这么多，光看是掌握不了的。我们以一个实际的例子来练习一下。首先你需要有一个微信号，这个号呢最好是绑定了卡的微信号，因为微搭是预付费模式，你要学习起码需要先付费开通了账号。
有的小伙伴会问，为啥不是免费的呢？因为咱们这个是商业版的软件，你发布之后就真正在互联网上使用了，常见的开发工具开发出来的产物还在你自己的电脑上，只能自娱自乐。所以要不要付费就看你学习的目的了。
账号开通之后我们打开低码控制台，在应用管理里新建一个应用，就是学习使用
在这里插入图片描述点击新建应用后会弹出应用的选择，如果我们已经具备了开发能力可以选择新建普通应用，如果想让平台给你创建一些基础的组件，那么可以选择模型应用。
在这里插入图片描述选择好了之后点击下一步就可以，输入我们的应用名称和应用标识，名称起汉语就行，标识起英文
在这里插入图片描述点击确定应用就创建好了，创建好了之后我们可以看到应用列表里多了一个应用
在这里插入图片描述点击编辑应用按钮就可以打开低码的编辑器
在这里插入图片描述编辑器分为几个部分，包括导航栏，左侧的组件页面区，中间的编辑区，右边的属性配置区
在这里插入图片描述有过产品设计经验的同学应该对这种页面布局比较熟悉，我们常见的原型工具axure和这个差不多。没有做过产品设计的也没有问题，我会一步步教会你使用这个工具。
应用创建好后默认会创建一个首页，我们就在首页上练习一下我们学到的知识。
小实验
- 往中间的编辑区拖入一个标题组件
- 设置标题的颜色为红色
- 改变标题的字体大小
如果是按照传统的开发思路，我们一般需要创建一个html格式的文件，在里边写具体的代码如
<html>
<body>
<h1>我是标题</h1>
</body>
</html>html语言的语法就是这种一对标签，然后里边放置具体的内容。低码开发不一样，像这种重复性的动作不用干了，直接往页面拖自己想要的组件就可以了。具体方法是在左侧的组件库里挑选合适的，我们这里选择了标题组件
在这里插入图片描述有些组件在数据页签中只能设置属性，标题组件直接在数据页签中就可以设置样式，我们可以让标题左对齐，颜色改为红色，级别的话我们保持默认，不同的级别字体的大小不一样
在这里插入图片描述是不是非常简单，我们进行了简单的几步操作就完成了一个组件的配置。赶紧练起来吧。
