插画风网站风格设计-几种类型的插画风格网页设计赏析
扁平化设计可以说是时下最常用的网页设计风格了，它弱化了材质、渐变、阴影，去除了冗余信息的图形元素、排版。这种风格设计可以使画面显得更加平滑，提升了网站内容信息的视觉层级，更加方便用户快速寻找自己需要的内容。同时扁平化的界面能更好实现不同尺寸的转化。这也是现在互联网公司较长采用的一种风格。
在很多特定的领域，举个例子比如说金融，插画能够借助色彩、图形和形象来讲述故事，让用户更清晰的理解复杂的金融功能，甚至强化信任感，而这是文本所不具备的。插画能带来强烈的情感连接。插画更适宜呈现故事 故事是最令人难忘的内容，剧情的走向和起承转合会给人留下深刻的印象。
渐变插画有点类似日本漫画场景的感觉，风格特别唯美浪漫。光感比较强，所以也称为微光插画。颜色一般采用相近色，颜色种类不要太多。特点-5d插画、立体感强、视觉冲击强。立体插画也称为5D插画，也就是在二维的空间里表现三维的事物。
网页banner可以运用插画来表达网站主题，同时加上插画图标的点缀，使网页看起来清新有趣，加强网站本身的独特性。扁平风：扁平化设计可以说是时下最常用的网页设计风格了，它弱化了材质、渐变、阴影，去除了冗余信息的图形元素、排版。
插画的7种风格特点-扁平、流行、常用的风格、简洁明了 扁平插画简单来讲就是把复杂的关系简约化，让画面更加清爽整洁，也是现在比较常用的风格了，很多商务工具类的app会选择使用这种风格。
MBE风格：扁平化潮流中的风格，圆润、可爱、呆萌、简洁，以设计师MBE为代表。矢量插画：矢量图中的风格，使用直线和曲线描述图形，色彩碰撞感强烈。5D风格：立体感和空间感强，类似带有3D效果的二维画面。森系风格：特点为水彩透叠、唯美、小清晰、淡雅，代表一种崇尚自然的生活态度。
网页的设计有几种方法
1、POP布局。POP引自广告术语，就是指页面布局象一张宣传海报，以一张精美图片作为页面的设计中心。常用于时尚类站点。优点：漂亮吸引人。缺点就是速度慢。作为版面布局还是值得借鉴的。
2、布局就是以最合适浏览的方式将图片和文字排放在页面的不同位置。不同的制作者会有不同的布局设计。网页布局有以下几种常见结构：“同”字型结构布局 所谓同字型就够就是指页面顶部为“网站标志+广告条+主菜单”或主菜单，下方左侧为二级栏目条，右侧为链接栏目条，屏幕中间显示具体内容的布局。
3、变化型：网页设计 即上面几种类型的结合与变化，比如本站在视觉上是很接近拐角型的，但所实现的功能的实质是那种上、左、右结构的综合框架型。关于第一屏所谓第一屏，是指我们到达一个网站在不拖动滚动条时能够看到的部分。那么第一屏有多“大”呢？其实这是未知的。
4、网页设计中常见的弧线效果，其实可以通过多种方式实现。接下来，让我们探讨几种主流方法。css3 border-radius 利用CSS3的border-radius属性，可以轻松绘制弧线。在实际应用中，只需设置圆的半径到足够大，其中一段弧即可呈现所需效果。
css怎么设置DIV边框
1、使用border-color属性来设置边框的颜色。可以使用CSS支持的所有颜色值来设置边框颜色，例如颜色名称（如red、blue等）、十六进制值（如#FF0000、#0000FF等）和RGB值（如rgb（255， 0， 0）、rgb（0， 0， 255）等）。示例：div { border-color： red； }，这将把div边框的颜色设为红色。
2、CSS 设置 div 边框样式的代码如下： 使用 border 属性：border 是最常用的设置边框的方式，它可以同时设置边框的宽度、样式和颜色。基本语法：border： width style color；示例：div { border： 3px solid black； } 这将为 div 元素设置一个 3 像素宽、实线、黑色的边框。
3、首先我们创建一个HTML文件，引入必须的css文件后，创建一个父div和两个子div作为测试。最简单的方法就是使用float浮动，将两个div进行左右浮动，即可设置出边距，这里适合使用百分比。然后是使用margin外边距，这也是常用的方法，可以设置上下左右边距，这里使用float将两个子div并列。
