但是根据草图或者设计图生成html和css在业界早已不算什么问题，早就可以自动化做。根本不需要AI、机器学习来做。
AI，ML和DL三者包含关系如下
AI和ML已经经历了几十年的发展和积累，而不是近年才发展起来的，最近热潮源于DL算法的研究新进展，突破了阻碍机器学习的几个瓶颈。
DL深度学习（deep learning）人工智能的这一次热潮来源于深度学习技术新突破。
深度学习 (deep learning)：深度学习是机器学习算法中人工神经网络的一个新网络算法，通过增加大量网络层数和自动权重处理来实现多特征大量数据的分类。深度学习属于用无监督式 Unsupervised或半监督式 Semi-supervised模式识别算法，可实现自动特征学习和分层特征提取，高效算法替代手工获取数据特征，累积式的进行网络的训练，训练和识别可以一起，不需要预先进行模型的训练就能直接工作。
DL的突飞猛进源于计算机硬件的快速发展，分布式计算、云计算等技术大大提高了计算机的运算能力，使得处理多层网络成为了可能。大家知道人工神经网络曾经也火过几次，比如反向反馈的BP神经网络，但是由于网络层数有限适用范围不是很广，效果也一般般，所以热潮没能一直延续下来。
机器学习关于ml机器学习，偶只简单的介绍下机器学习的概念和应用范围。机器学习跟模式识别，统计学习，数据挖掘都属于人工智能算法，用于实现识别，分类和决策。机器学习与领域技术的结合，造就了计算机视觉MV、语音识别、自然语言处理等专门的机器学习学科。
其他更多资请料自行搜索，还有ng大大的公开课不错，有志于这方面可以去学学，此处不在赘述。
回应提问根据设计图生成html和css在业界就不算是个问题，早就可以自动化做，根本不需要AI、机器学习来做。那么为什么还有人问这样的问题呢？
平时也老有一些传统公司的人说他们用人工智能做了啥；他们产品用了区块链了，用了量子化了。这基本上都是来蹭热度，忽悠人的。对这类公司要小心，很可能就是不好好做业务的，靠忽悠骗钱的。
那么，既然html，css不用人工智能就能做的好好的，那能用人工智能帮助做些事吗？笔者回答是肯定的。
利用人工智能协助解决前端需求不明的痛点前端开发中的痛点是什么？是需求不清楚、不明确，一个设计不断改来改去，太费劲，太耗时间。而这恰好是AI可以帮助大家做的，也是AI擅长做的。大家把历史需求，变更，人员，设计结果，配图，配色，设计师，甲方等相关信息都搞成特性输入网络进行训练形成模型，再有需求过来，简单一说要求，人工智能就自动决策，给出最适宜的设计（设计人员参与，ai做不到），并并自动化生成网页了（最后这步不需要AI）。
好了这就是偶的答案了，最后吐槽下悟空问答APP编辑框设计真不行，一不小心就点提交了。实际上，还没写完呢，就给发出去了，也没个确认。差评！
css 背景渐变色，css gradient 左右，css边框距离代码，CSS教程下载软件不用，导航css代码怎么写，css 文本居中后怎么偏移，css3 box-shadow
@ 怎样区分后代选择器和子代选择器？
1.第一从符号上来区分后代选择器：是用空格来分隔开来 例如<h1>一个<span>人</span>的战争</h1> 就是h1 span{}子代选择器：用特殊符号> 例如 h1>span{}
2.第二从用法上区分后代选择器html部分：<ul class=”study”> <li>物理 <ul> <li>力学</li> <li>声学</li> <li>电磁学</li> </ul> </li> <li>数学 <ul> <li>微积分</li> <li>概率论</li> <li>博弈论</li> </ul> </li> </ul> css部分//使用子代选择器的效果.study >li{ border:1px solid red;/*只给物理和数学加一个红色方框*/}//使用后代选择器的效果.study li{ border:1px solid red;/*给物理 力学 声学 电磁学 和数学 微积分 概率论博弈论都加一个红色方框*/}这说明子代是他是单传只给物理和数学就断子绝孙，后代是一代传一代。
子代选择器时效果图：
后代选择器时效果图：
@ 你是如何成为前端工程师的？
HTML5+CSS3网站开发
主讲内容：
1、PhotoShop-1天
2、HTML5-2天
3、CSS3-8天
4、电商实战项目-4天
知识要点：
1、PhotoShop：
采用商业案例掌握Photoshop基本使用，能够独立完成尺寸测量、切图、图层操作、Cutterman切图神器等。
2、HTML5：
客户端和服务端交互原理、浏览器内核、语法及使用、常用标签、语义化、表单元素、HTML5 新标签、编码规范。
3、CSS3:
CSS常用属性、各种选择器、继承和优先级、数值与单位、文字文本样式、CSS盒子模型、CSS背景技巧（圆角、阴影、过渡等）、定位和浮动、伪类和伪元素、、CSS高级技巧（精灵图、滑动门、CSS三角等）、布局样式、CSS兼容性问题、Google浏览器开发者工具调试技巧。
4、实战项目（网易严选）：
布局技巧、完整的多页面网站开发、CSS模块化开发，复合选择器应用技巧、复杂网页排版和布局、特效设计等。
通过该项目培养代码组织原则，项目开发流程，注重培养分析问题、解决问题的能力、调试能力，开发思维的塑造。