① 写网页时，怎样制作两列弹性布局
列液态，列弹性，列固定这几种情况属于DIV+CSS标准布局中的术语。液态表示盒宽度用%表示，也是一个相对的值（实际宽度参照其父元素）。弹性表示盒宽度以em表示，所以它也是一个相对的值了，它是受当前字体大小的影响，即其宽度为当前字体大小的多少倍。固定一般用PX表示宽度值，指定后，其宽度便回定为多少像素了。
② 静态网页设计制作中的布局模式
一、静态布局（Static Layout）
即传统Web设计，网页上的所有元素的尺寸一律使用px作为单位。
1、布局特点：不管浏览器尺寸具体是多少，网页布局始终按照最初写代码时的布局来显示。常规的pc的网站都是静态（定宽度）布局的，也就是设置了min-width，这样的话，如果小于这个宽度就会出现滚动条，如果大于这个宽度则内容居中外加背景，这种设计常见与pc端。
2、设计方法：
PC：居中布局，所有样式使用绝对宽度/高度(px)，设计一个Layout，在屏幕宽高有调整时，使用横向和竖向的滚动条来查阅被遮掩部分；
移动设备：另外建立移动网站，单独设计一个布局，使用不同的域名如wap.或m.。
在移动端开发中采用静态布局的两种方式：
（1）在viewport meta标签上设置width=320，页面的各个元素也采用px作为单位。通过用JS动态修改标签的initial-scale使得页面等比缩放，从而刚好占满整个屏幕。（见前端开发-web app 变革之rem）
（2）设在viewport meta标签上设置content"width=640,user-scalable=no，页面的各个元素也采用px作为单位。由于640px超出了手机宽度，浏览器会自动缩小页面至刚好全屏。
优点：这种布局方式对设计师和CSS编写者来说都是最简单的，亦没有兼容性问题。
缺点：显而易见，即不能根据用户的屏幕尺寸做出不同的表现。
二、流式布局（Liquid Layout）
流式布局（Liquid）的特点（也叫"Fluid") 是页面元素的宽度按照屏幕分辨率进行适配调整，但整体布局不变。代表作栅栏系统（网格系统）。
网页中主要的划分区域的尺寸使用百分数（搭配min-*、max-*属性使用），例如，设置网页主体的宽度为80%，min-width为960px。图片也作类似处理（width:100%, max-width一般设定为图片本身的尺寸，防止被拉伸而失真）。
1、布局特点：屏幕分辨率变化时，页面里元素的大小会变化而但布局不变。【这就导致如果屏幕太大或者太小都会导致元素无法正常显示】
2、设计方法：使用%百分比定义宽度，高度大都是用px来固定住，可以根据可视区域 (viewport) 和父元素的实时尺寸进行调整，尽可能的适应各种分辨率。往往配合 max-width/min-width 等属性控制尺寸流动范围以免过大或者过小影响阅读。
这种布局方式在Web前端开发的早期历史上，用来应对不同尺寸的PC屏幕（那时屏幕尺寸的差异不会太大），在当今的移动端开发也是常用布局方式，但缺点明显：主要的问题是如果屏幕尺度跨度太大，那么在相对其原始设计而言过小或过大的屏幕上不能正常显示。因为宽度使用%百分比定义，但是高度和文字大小等大都是用px来固定，所以在大屏幕的手机下显示效果会变成有些页面元素宽度被拉的很长，但是高度、文字大小还是和原来一样（即，这些东西无法变得“流式”），显示非常不协调。
三、自适应布局（Adaptive Layout）
自适应布局的特点是分别为不同的屏幕分辨率定义布局，即创建多个静态布局，每个静态布局对应一个屏幕分辨率范围。改变屏幕分辨率可以切换不同的静态局部（页面元素位置发生改变），但在每个静态布局中，页面元素不随窗口大小的调整发生变化。可以把自适应布局看作是静态布局的一个系列。
1、布局特点：屏幕分辨率变化时，页面里面元素的位置会变化而大小不会变化。
2、设计方法：使用 @media 媒体查询给不同尺寸和介质的设备切换不同的样式。在优秀的响应范围设计下可以给适配范围内的设备最好的体验，在同一个设备下实际还是固定的布局。
四、响应式布局（Responsive Layout）
随着CSS3出现了媒体查询技术，又出现了响应式设计的概念。响应式设计的目标是确保一个页面在所有终端上（各种尺寸的PC、手机、手表、冰箱的Web浏览器等等）都能显示出令人满意的效果，对CSS编写者而言，在实现上不拘泥于具体手法，但通常是糅合了流式布局+弹性布局，再搭配媒体查询技术使用。——分别为不同的屏幕分辨率定义布局，同时，在每个布局中，应用流式布局的理念，即页面元素宽度随着窗口调整而自动适配。即：创建多个流体式布局，分别对应一个屏幕分辨率范围。可以把响应式布局看作是流式布局和自适应布局设计理念的融合。
响应式几乎已经成为优秀页面布局的标准。
1、布局特点：每个屏幕分辨率下面会有一个布局样式，即元素位置和大小都会变。
2、设计方法：媒体查询+流式布局。通常使用 @media 媒体查询 和网格系统 (Grid System) 配合相对布局单位进行布局，实际上就是综合响应式、流动等上述技术通过 CSS 给单一网页不同设备返回不同样式的技术统称。
③ web布局有包括哪些
网页基本布局方式：
（1）流式布局
Fluid
流布局与固定宽度布局基本不同点
就在于对网站尺寸的侧量单位不同。固定宽度布局使用的是像素，但是流布局使用的是百分比，这位网页提供了很强的可塑性和流动性。换句话说，通过设置百分比，我们不需要考虑设备尺寸或者屏幕宽度大小了，可以为每种情形找到一种可行的方案，应为你的设计尺寸将适应所有的设备尺寸。流布局与媒体查询和优化样式技术密切相关。
（2）固定布局 Fixed
在固定布局中，网页的宽度是必须指定为一个像素值，一般为960px。过去，开发人员发现960px是最适合作为网格布局的宽度，因为960可以
整除
3，4，5，6，8，10，12和15。在今天，在
web开发
中还是比较普遍使用固定宽度布局的，因为这种布局具有很强的稳定性与可控性。但是同时也有一些劣势，固定宽度必须考虑网站是否可以适用于不同的屏幕宽度。
（3）弹性布局
Elastic
弹性布局跟流布局很像，主要不同是大小单位。弹性布局的大小单位不是像素或者百分比，而是em或者rem，避免了根据px局部在高分辨率下几乎无法辨识的缺点，又相对于%百分比更加灵活，同时可以支持浏览器的字体大小调整和缩放等的正常显示，需要一段时间适应而且不易从其他布局转换过来。
（4）伸缩
Flex
box
使用
css3
Flex系列属性进行相对布局。对于
富媒体
和复杂排版的支持非常大，但是存在兼容性问题。
（5）响应式
使用@media媒体查询给不同尺寸和介质的设备切换不同的样式。优秀的响应范围设计可以给适配范围内的设备做好的体验。
④ web前端使用什么可以实现弹性项目的可视化排序
可以使用Highcharts、ECharts和G2。
设计前端网页，可视化的第三方控件还是比较多的，第三方控件一般采用Json格式，接收和展示数据。Json格式数据，是用开发语言进行数据接口开发，从数据库或终端设备上提取数据返回给网页。主要有3个前端可视化库，分别是Highcharts、ECharts和G2，这3个库都可以快速完成前端网页数据可视化，而且制图方便、种类繁多。
⑤ 行内元素可不可以使用弹性布局
可以，行内元素内容为空也会在布局中消失(不推荐为空)。 兼容性是支持>=IE8,IE6-7请参见专注WEB前端开发。
⑥ 前端布局的几种方式
1.固定布局，静态布局
传统Web设计，网页上的所有元素的尺寸一律使用px作为单位，网页宽度一般为960px。网页布局始终按照最初写代码时的布局来显示，不受浏览器影响。如果浏览器宽度如果小于这个宽度就会出现滚动条，如果大于这个宽度则内容居中外加背景
2.流式布局
流式布局使用的是百分比，这位网页提供了很强的可塑性和流动性，与固定宽度布局基本不同点 就在于对网站尺寸的侧量单位不同。屏幕分辨率变化时，页面里元素的大小会变化而但布局不变，这可能导致如果屏幕太大或者太小都会导致元素无法正常显示。
3.自适应布局
自适应布局的特点是分别为不同的屏幕分辨率定义布局，即创建多个静态布局，每个静态布局对应一个屏幕分辨率范围。使用 @media 媒体查询给不同尺寸和介质的设备切换不同的样式，例如宽度960px是一种样式，网页宽度1440px是另一种样式。改变屏幕分辨率可以切换不同的静态局部，但在每个静态布局中，页面元素不随窗口大小的调整发生变化。
4.弹性布局
使用em 或 rem 单位进行相对布局，相对%百分比更加灵活，同时可以支持浏览器的字体大小调整和缩放等的正常显示。这种布局中包裹文字的各元素的尺寸采用em/rem做单位，而页面的主要划分区域的尺寸仍使用百分数或px做单位。默认的文字大小16px就是1em。
5.响应式布局
每个屏幕分辨率下面会有一个布局样式，即元素位置和大小都会变，设计方法通常采用了媒体查询+流式布局，使用@media媒体查询给不同尺寸和介质的设备切换不同的样式。为不同终端的用户提供更加舒适的界面和更好的用户体验。
⑦ 网站的结构应该怎么进行布局设置
网站结构布局是网站建设重要的一个环节，网站结构布局主要是由网站的策划人员将网站的布局草稿以及一些具体细节，提交给网页制作人员。网页制作人员就根据策划内容进行网站的建设，添加内容。在建设网站结构之前，我们一定要清楚一个道理，网站的结构是否合理对网站的发展非常重要。网站的结构是一个比较大的框架，要怎样设计布局才可以体现出网站的价值呢？
第一、要根据网站的主题进行的确定以及设计网站的主题主要是通过企业所在的行业的一些特性以及目标用户群的一些习惯。例如，品牌类型的网站建设讲究简约大方，在建设的时候，一般都是运用一些与品牌价值相关的方面的内容设计网站的首页，这样就可以很好地表现出高端、大气，高贵的特性，这一点也是非常重要的。一般的企业网站制作主要是以产品的展示以及效益方面为核心，而且更多的时候是要考虑SEO的优化。要怎样才能将网站的SEO相关的细节展示出来是十分重要的。所以，企业的业务员在与客户沟通的时候，要跟客户说清楚企业网站的类型是什么。
第二、网站视觉营销方面的策划，主要还是要看网站结构设计"网页制作的视觉效果"对于一个企业网站，要怎样建设才可以体现出网站品牌的特色呢，怎样表现自己的不同点呢？我们可以通过视觉的设计，无论是什么类型的网站，视觉设计永远是最要表达的一个重点。简单来说就是网站的设计人员，用户的体验程度主要是有设计人员的专业程度决定的，而且设计师可以通过自己的高超技术吸引用户，把用户留在网站。搜索引擎是根据用户留在网页的时间，来判断这个网站给用户的体验感。
第三、网页制作的结构要根据用户的需要进行用户的需求包括什么呢？主要有对产品的关注、产品的价值等等方面的满足感。因此，网页制作人员在布局是要考虑好用户的需求。还要对自己产品非常熟悉，服务方面有什么优势等等。网站的细节完善后，就要将用户最关心的问题，按照关注程度进行排列。网站首页的内容设置用户最关注的内容，要将网站的重点突出。还要根据用户的重视程度进行合理的布局。网站的首页中部是最具焦点的位置，就放置产品，左侧可以设置一些企业动态。右侧可以设置一些解决方案的分析。不同的位置可以设置相对应的内容，做到合理布局。
第四、对于一些固定的元素，要更加注重细节方面的设计因为这些元素几乎每一个页面都会有，例如网站导航设计有什么需要注意网站导航，网站底部等等。如果是一些文字型的固定元素，要注意排版的格式，是不是方便用户的访问，特别是文字的颜色使用。
⑧ 请问web页面布局包括哪些都有什么用
1.静态布局（Static Layout）
即传统Web设计，对于PC设计一个Layout，在屏幕宽高有调整时，使用横向和竖向的滚动条来查阅被遮掩部分；
意思就是不管浏览器尺寸具体是多少，网页布局就按照当时写代码的布局来布置；
对于移动设备，单独设计一个布局，使用不同的域名如wap.或m.。
2、弹性布局
弹性布局是CSS3引入的强大的布局方式，用来替代以前Web开发人员使用的一些复杂而易错hacks方法（如使用float进行类似流式布局）。
其中flex-flow是flex-direction和flex-wrap属性的简写方式，语法如下：
flex-flow: <flex-direction> || <flex-wrap>
flex-direction: row（初始值） | row-reverse | column | column-reverse
flex-wrap: nowrap（初始值） | wrap | wrap-reverse
flex-direction定义了弹性项目在弹性容器中的放置方向，默认是row，即行内方向（一般而言是由左往右，但注意这个和书写模式有关）。
flex-wrap定义是否需要拆行以使得弹性项目能被容器包含。*-reverse代表相反的方向。
两者结合起来即flex-flow属性就确定了弹性容器在main axis和cross axis两个方向上的显示方式，下面的例子很直观的说明了各个属性值的区别：
3、自适应布局（Adaptive Layout）
自适应布局（Adaptive）的特点是分别为不同的屏幕分辨率定义布局。布局切换时页面元素发生改变，但在每个布局中，页面元素不随窗口大小的调整发生变化。
你可以把自适应布局看作是静态布局的一个系列。
就是说你看到的页面，里面元素的位置会变化而大小不会变化；
4、流式布局（Liquid Layout）
流式布局（Liquid）的特点（也叫”Fluid”) 是页面元素的宽度按照屏幕进行适配调整，主要的问题是如果屏幕尺度跨度太大，那么在相对其原始设计而言过小或过大的屏幕上不能正常显示
。
你看到的页面，元素的大小会变化而位置不会变化——这就导致如果屏幕太大或者太小都会导致元素无法正常显示。
5、响应式布局（Responsive Layout）
做手机网站必加的一句头部(head)代码
<metaname="viewport"
content="width=device-width,
initial-scale=1.0,minimum-scale=1.0,
maximum-scale=1.0,
user-scalable=no">
name="viewport"
名称=视图width=device-width
页面宽度=设备宽度(可以理解为获取你手机的屏幕宽度)initial-scale-初始的缩放比例 minimum-scale-允许用户缩放到的最小比例 maximum-scale-允许用户缩放到的最大比例 user-scalable-用户是否可以手动缩放
分别为不同的屏幕分辨率定义布局，同时，在每个布局中，应用流式布局的理念，即页面元素宽度随着窗口调整而自动适配。
可以把响应式布局看作是流式布局和自适应布局设计理念的融合。
每个屏幕分辨率下面会有一个布局样式，同时位置会变而且大小也会变。