pc端页面怎么做自适应布局
给大家讲明白什么是 flex 布局、响应式布局、知识性布局，这也是面试当中常用的一个面试题，好多同学都搞不明白，今天让大家彻底的搞明白。那么首先说 flex 布局， flex 布局它也叫弹性布局， 这个是官方的一个定义，那么 flag 布局怎么样？定义非常简单，我们需要在我们的这个 div 元素上，我直接把他的 display 啊定义成 flat， 那么它里面的元素，他的子元素都是 flag 布局， 那么福来布局怎么用？这个非常简单，我们去看他的官网就可以了。一般呢我们现在主流的比如说做水平居中啊、垂直居中啊，自适应布局啊，基本上都是用福来布局去搞的，我用四布局和自适应布局， 那么咱们先看一看这张图啊，响应数据一般是一个网站，他能够兼容多个端，比如手机端、平板端，还有你的电脑外部端，那么最终他每一个端他呈现了一 页面的样式是不一样的，你可以看一下这个页面的样式是完全不一样的，那么自适应布局他就不一样了，他其实是什么？在不同的尺寸下，他的布局是一样的，你看到没有？也就是说我们可以能清晰的感觉到，就是响应式布局的实现要比自适应布局要麻烦， 代码要肯定写的多，反应是布局，我们应该，我们一般怎么做？我们一般都是用这个 media 这个媒体查询， 也就说根据这个不同的尺寸设置这个分解点，然后再设置分解点样式，从而达到这种响应式布局的效果。那么还有一个很重要的一点就是我们在 matter 里面需要设置 这句话，我可以给大家做一个演示，那么他运行之后的效果其实是这样的，对吧？上面是网站的导航，中间是内容，对吧？那么我这时候比如说我改变他的尺寸，你看我改变他尺寸 的时候，他其实他的布局是变化了的，然后我再进行改变的时候，对吧？他其实他的宽度也变了，你看他导航，导航 他也变变成这样了，一般都是移动端的布局了，移动端我可能就有这种效果，相当于他这一套带呢，能够在 pc 端也能访问，在 pad 端也能访问，在手机端也能访问，一般的哈，我们实现这个响应式布局 还是支持性布局。那么我们的 c i s 的元素的值一般都会主流的，现在是什么方案呢？主流的的单位基本上就这么几类，是吧？我相信我们最熟悉的就是 p s 单位， 那么其实现在有些网站他还是用 i m 的这种方式，那但现在主流的都是用 v w v a 制的这种方式就是四口宽度，那么我这个其实是用了什么 flag 布局和什么 i e m 去做的。所以说如果面试的时候他在为你比如 说这这三个的区别，那么他怎么样具体实现？也就是我们一般都用 flat 布局去实现响应式布局和知识性布局，那么这两个响应式和知识性比较难实现的就是响应式。大家有什么不同的意见可以评论区留言探讨。
粉丝5.1万获赞45.1万
相关视频
02:01查看AI文稿AI文稿大家好，我们来看这个页面哈，当他宽度小于一定程度以后，会比较丑，所以我想让这张图片可以自动隐藏掉，那如果只是隐藏图片，其实很简单，我们来试一下，其实就是这个卡管层，我们把它的 supple 隐藏掉就可以了。 好，我们看他隐藏掉了，但是呢，如果宽度小一定程度呢，由于这个外层的 worper 设了一个固定宽度，所以我们要把这个固定宽度也设一下，说这个 worper 不能固定宽度了， 百分之百，这样他就集中了，但是呢，这两行样式只适用于小于一定 宽度的情况下的浏览器，所以这个应该怎么写呢？我们就要用到眉点，眉点四根，我们加一个暗的， 因为这个界限是九百像素，那小于九百像素就用下面这两个样式，那也就意味着他的最大宽度是九百的时候，适用于这两个样式。 我们来看一下， 大概没问题了，但是呢，这个滚动还稍微有点问题，因为当他小于九百的时候，就没必要这样滚动了， 所以呢，我们再把它滚动恢复一下， 能黑的不用变 高度。我们首先恢复默认滚动，也恢复默认，好打开，这样就可以了， 宽的时候是这样滚动，窄的时候呢是全屏滚动的。好，今天就到这里，谢谢大家，再见。
2499程序员小山与Bug
04:24查看AI文稿AI文稿第二种单列布局方式呢，是这样的， 它的特点呢是头部和底部啊，它是自适应界面的宽度的， 但是主体部分呢，它的宽度是相对固定的，同时要注意啊，头部和底部的内容区域呢，它的宽度呢也是固定的，也就是说头部和底部，它的内容显示部分呢，和主体的宽度是一样的。好，下面呢我们看一下如何用代码来实现 自适应单列布局和固定宽度的单列布局，它们的代码呢是非常相似的，再新建一个文件。 好，我们将第 一个案例的代码呢复制过来，复用一下，它们的 c、 s、 s 部分呢，都是可以共用的，我们只要简单修改一下镀膜结构就可以了，它的基本思路呢是这样的， 头部尾部单独放在一个独立的容器中啊， 剪设置一下高度就可以了。 第二呢，头部和尾部的内容区呢还是和主体等宽的。 第三 主体呢单独放到一个容器中啊，并且呢设置一下左右的自动水平区中。 最后 c， s、 s 样式不用修改，只需要调整一下镀木结构就可以啊， 我们来调整一下动物结构啊，首先呢，将这组 content 标签先把它取出来放到这里啊，然后呢在这个头部中呢，我添加 一个 container， 这一组 container 放到头部中。 好，这样呢就实现了头部的自适应 主体也是一样啊，我们把这些代码呢简单复制一下就可以了。 好，第二个呢是主体， 第三个呢是底部， 好将这两行代码呢删除，这样呢，我们就实现了单列的自适应布局。下面呢我们来看一下执行结果， 现在呢，我们可以看到当前页面呢，已经实现了自适应啊，你看头部和主体，它的内容显示区域呢，这一块啊，是这一块区域，就是中间的区域啊，中间区域 它的宽度呢，仍然是九百六，而这部分区域呢，就是头部的左侧啊，这块区域呢，它是随着屏幕的宽度而自动变化，或者说是自动延展的。而主体部分呢，它的宽度是固定的。你这里看不出来的原因呢，是因为我给主体加了个背景啊，如果说你在 主体中添加了其他内容的话呢，你可以看到主体内容区域呢，他只会显示在中间的这个九百六的这个宽度内，也就是那个 content 容器中关于单列的资讯布局呢，我们就讲到这里。
11编程小帮手
01:21查看AI文稿AI文稿自适应和响应式的区别你真的分清楚了吗？今天十秒告诉你！一、自适应设计需要设计师根据不同的尺寸来设计多个不同布局的页面，一般会设计到手机端、拍的端和电脑端， 然后开发也需要为不同的尺寸写好不同的样式，所以当你用不同的设备打开同一个网页时，布局差异会很大。二、响应式布局，设计师只需要出一套页面，开发也只需要写一套代码以缩放图像，换行或者调整布局，以便网站可以适应于任何屏幕尺寸，有点像摄影中的一镜。到底。 那怎么区分线上的网站是响应式还是自适应呢？告诉大家一个简单的方法，同一个网页在不同设备上打开时，同一个网址为响应式，有多个不同的网址则为自适应，比如手机端一般会在网址前面加上 m 或者膜拜哦。那我们应该 如何选择，用自适应还是响应式呢？如果你的网站功能不多，用户交互少，主要用于展示，就可以用响应式，比如企业官网、产品官网开发，实现起来成本也小。如果你的产品功能较多，且同时需要兼顾手机端、网页端或者 pad 端，自适应设计则更加合适， 比如弊端后台网页、电商网页等等，当然也可以结合使用。下期我们接着讲如何利用三格进行响应式设计。
1715阿睿ARUI
01:49查看AI文稿AI文稿想快速搭建一个像这样的自适应网站，我们可以用什么方法来快速进行操作呢？其实非常的简单，今天就来教大家在一个端口操作，轻松生成多个端口的网站。 这里给大家分享的是乔拓云平台建站系统，在他的官网免费注册登录一个账号，我们就可以进入乔拓云的产品中心页面，在这里点击企业网站，就可以进入网站后台管理页面，开始进行搭建网站的操作。第一步，点击左侧的域名管理，购买绑定一下网站的域名。 第二步，点击概况，找到电脑网站，点击进入网站的编辑页面，然后点击上方的极速建站，我们就可以根据各种行业的分类或者输入关键词来快速的搜索网站模板，然后找到上方的两种模板，这里我们选择自适应模板，然后选择一个喜欢的模 模板，点击使用就可以快速的搭建网站。复制模板后就可以进入编辑页面，这里我们双击网站的标题、栏目、横幅以及里面各种文字、图片信息，都可以快速的进行编辑与修改。除此之外，左侧的工具栏也支持我们新增修改网站的模块 排版，更换网站的主题样式，设置网站的页面组件，进行百度优化，生成小程序推广。等我们将这个网站设计制作好之后，点击上方的预览，就可以快速的查看网站的效果。因为是自适应网站，所以我们点击上方的图标， 还可以查看平板端以及手机端的适应效果，确定效果没有问题。回到编辑页面，我们就可以快速的将网站保存与发布，然后发送审核，等网站发布成功，还可以在后台管理页面一键的管理维护这个网站。 看到这里，如果你也想快速搭建一个自适应网站，那就快来瞧措云试试吧！以上就是今天分享的全部内容，我们下期视频再见！
23乔拓云.智能建站
00:56查看AI文稿AI文稿这一集我们介绍如何使用菲格马的奥托雷奥。在低端中快速制作表格。完成后你将可以随意拉伸列的宽窄以及调换他们的位置。那我们开始吧。 首先要画一个 freme 作为行容器，在里面添加一行文字框，选 freme， 点击凹凸雷奥。先把间隔和内编剧清零。点击右边按钮，我们让框内元素居中，并设置上下内编剧。接下来再画一个 freme 作为列容器， 同样把间隔和内边距清零，并添加颜色来分辨形状范围。然后我们放入行容器并把列容器拉宽，这时我们发现行容器并不会跟随拉伸。我们选中行容器，在 resize 下面，我们把横向宽度改成 fucocan 填充容器， 这样就可以自适应拉伸了。多复制几层形成裂。最后我们需要把裂放入表格里， ctrl out 加 k 变成足键，放入新建的奥拓莱奥的容器里，复制几个，添加些许细节就完成了。
2792xg
02:18查看AI文稿AI文稿手把手教你做自动布局卡片！这一期我们要实现一个文本内容，根据宽度自适应的卡片。我们把卡片里面的元素简化一下，红色代表标题，绿色代表长文本，蓝色代表图片。 我们先选中红绿两个方块， shift 加 a 添加自动布局。添加了自动布局的元素会被装进一个 fringe 容器里，并且元素之间的间距可以通过右侧面板调节，上下编剧以及左右编剧都是可以通过面板调节的，元素的排列方向也是可以修改的哦。 我们拉大红绿方块的容器，理想中的效果是绿色方块宽度能自适应变化。现在我们选中绿色方块，在右边面板找到它的宽度属性，下面有一个 fixed， 代表它的宽度是固定的。我们将 fixed 改成 few continuer， 意思是让它的宽度填满容器。现在在 拖动容器会发现绿色方块已经能够自动变宽了。学到这里，你已经掌握了百分之四十的自动布局之势。下一步我们要把代表图片的蓝色方块也加进去，选中红绿的容器和蓝色方块，再次按下是加 a， 添加自动布局。我们拉宽容器， 发现绿色方块的自适应似乎失效了，但其实不是这样，如果我们直接拖动红绿方块的容器，可以看到绿色方块还是能自适应的。我们检查一下红绿容器的宽度属性，会发现包裹红绿方块的容器， 它的宽度属性是 fixt， 也就是固定的。现在把它改为 few container 填充容器，再去拖动最外层容器时，绿色方块就可以自适应了。 我们换成真实的文本，看图片，再做一次，选中所有文本式，加 a， 添加自动布局。选中需要自适应的文本，将它的宽度属性改成 fuel container， 现在文本已经能自视 硬了。接下来把图片和文本容器打上自动布局，把文本容器的宽度属性改成 few container， 拖动最外层容器，可以看到文本已经自适应了。我们调整一下容器内的间距，最后给外层容器加上填充色，添加左右编剧焊圆甲，这样一个自动布局卡片就完成了。 用自动布局做出来的卡片，无论你去修改它元素的大小，元素间距或者卡片的编剧，它都是能够自适应的。另外，除了 figma， 国内的 master 够汉吉时设计也是能做自动布局的哦。 老师，那是 gatch 呢，丢进垃圾桶里面。关注我，了解更多设计师保命技巧！
452慢慢来
02:07查看AI文稿AI文稿注意看，嗯，这是一个资深表单，他可以像这样随意拉伸每列的宽度，然后调换每个列的位置，还能任意的添加行和列的数量，只需要三十秒。我用的是 pixel 制作的，如果你们用飞马什么的也可以。道理都一样，在浏览器中直接搜 pixel， 然后点这个 free button 就可以开始使用了。 我们先新建设计文件，然后创建一个画板，在画板里面输入文字，然后选中画板，点击右侧的这个自动布局，并且把这里的间距和边距都清空，上下边距呢，我们设置成平时常用的就行了，给个十六。 ok， 那现在呢？我们可以看到画板已经保留了上下的编剧，我们再新建一个画板作为列的容器，给他添加上自动布局方式呢？改成纵向，然后清空编剧，稍微改个颜色，方便我们等会区分，然后把我们之前的内容拖进来，此时我们可以看到，改变外面的这个列 宽度啊，内容是不会跟随变化的，下面一步很关键，同学们认真看，选中里面的画板，把这个响应方式改成为填充容器，这个时候你再改变外面的尺寸啊，里面就跟着变化了。然后我们还是选中里面的这个内容，画 c 画微微微微微，这列就做出来了。 然后最后一步，再新建一个容器，跟之前一样添加自动布局，全选之前的内容，把它改成组件，拖到容器里面，再复制，复制，复制复制。然后选中组件，把每个组件的这个地方也改成填充容器，用插件中把文字替换一下，看看效果。 ok， 然后我们再把它复制到之前的布局里面，在表单的约束这里啊，固定宽度改为左右看就做好了，如果你还能看到这里，那一定是铁粉。再给你们分享一个厉害的，在左侧组件这一栏还有个叫做资源的分类，点开它看到了吗？ 基本上所有的大厂的组建库全都预设好了，随便点开一个，我们看到组建分类特别清晰，需要哪个直接拖进来就行，那如果这些还不能满足你， ok， 我们可以直接在下面这个入口找到资源社区， 在这里面基本上涵盖了我平时会用到的所有分类，咱们根据自己的需要找到，然后复制加修改，懂吗？那么以上呢，就是本期视频的全部内容，如果觉得对你有所帮助，还希望你能给我点赞支持，咱们下期再见。
6224赫华啊
01:27查看AI文稿AI文稿像这样的自适应网站该怎么快速搭建呢？今天就给大家分享一件套用模板快速搭建自适应网站的方法。那这边分享的是乔拓云平台的建站系统，我们只需在他的官网免费注册登录一个账号， 进入他的产品中心页面，找到企业网站，点击去管理，进入网站的后台管理页面。在操作之前，我们首先要进行网站域名的购买与绑定， 一步设置完成才可以进行网页的设计。点击电脑网站中的去设计，进入网站的编辑页面，然后点击极速建站。这里可以选择标准模板和自适应模板， 选择号之后点击更多行业。还可以根据各种行业的分类或者输入关键词来快速锁定自己需要的模板。然后点击一个喜欢的，点击使用，就可以进入网站的编辑设计页面了。这里我们可以直接点击修改网站的标题、 栏目、横幅以及里面的各种图片文字信息。那在页面左侧的工具栏也支持新增修改网站的模块，更换网站的样式、风格，设置网站的页面组件，进行百度优化，生成小程序推广等等。 那等我们将这个网站按照自己的想法设置好之后，点击预览。还可以进行网站效果的查看。除了可以查看电脑端的，我们点击页面上方的端口图标， 还可以查看平板端以及手机端的网站效果。那如果你也想像这样子快速的搭建一个自适应网站，那就快来乔托云试试吧。以上就是今天分享的全部内容，我们下期视频再见。
15乔拓云.智能建站
00:32查看AI文稿AI文稿大家好，我是想长胖的程序员，今天我们来学习给图片囊添加自适应布局。首先要去掉浮动，通过 after 尾类添加 clear both 属性就可以去除浮动。 当屏幕的最大宽度为七百 px 时，图片展示两列，设置它的宽度为百分之四十九点九九九九九。当屏幕最大的宽度为五百 px 时， 展示一列，设置它的宽度为百分之百。我们通过调整浏览器窗口的大小可以看到图片展示为两列、一列以及四列的样子。明天见呀！
13程序员晨光
08:01查看AI文稿AI文稿you make me feel so crazy still in love with you you i can love all right coming around the sight darling alone lord i'm sorry to let you。
606艾恩小灰灰
00:44查看AI文稿AI文稿响应式布局和自适应布局的区别你真的知道吗？先说自适应布局，这要求设计师根据不同尺寸来设计多个不同布局的页面，一般会涉及到手机端、 pc 端和派的端，同时开发也需要根据不同尺寸进行还原， 这样同一个网页在不同的设备中的布局差异就会很大。而想意识布局，只需要设计一套页面， 以缩放图像和换行来调整布局。既然响应式布局这么方便，那可以直选这种布局方式吗？如果页面功能和交付不多，主要用于展示，就可以使用响应式布局，比如企业的官网，这样开发成本也相对小一些。
200摹客设计云
01:47查看AI文稿AI文稿教你用简单的操作快速搭建一个餐饮类的自适应网站，只需在一个端口编辑，就可以自动地适应多个端口的页面。那接下来就教大家具体的操作。首先我们在浏览器搜索一下乔破云智能建站，在他的官网点击免费注册，进入注册页面，填写注册信息， 注册完成，点击马上登录，就可以进入乔拓云的产品中心页面。然后在这些产品当中找到企业网站，点击去管理， 就可以进入网站后台管理页面。在这个页面我们要进行两个操作。首先点击左侧的域名管理，购买绑定一下网站的域名， 点击概况，找到电脑网站，点击去设计，就可以进入网站的编辑页面。在这个页面点击上方的极速建站，就可以根据各种行业的分类或者输入关键词来快速搜索需要的模板。同时在这些模板 版当中选择一个喜欢的，点击使用，我们就可以开始编辑网站了。在模板中双击网站的标题、栏目、横幅以及里面各种图片、文本信息，都可以进行直接的修改与替换。同时页面左侧的工具栏也支持我们新增修改网站的模块，更换网站的主题样式 设置网站的页面组建，进行百度优化生成小程序推广等等，能帮助我们更好的丰富完善这个自适应网站的内容。等我们将这个网站制作好之后，点击上方的预览，也可以快速的查看网站的效果。点击上方的图， 还可以查看平板端以及手机端的网站效果。确定网站没有问题之后，回到编辑页面，就可以点击上方的保存与发布，将这个网站发送审核。同时在后台管理页面也 支持我们对这个网站进行一键的管理与维护。还等什么呢？像这样简单搭建网站的方法，快来乔拓云试试吧。以上就是今天分享的全部内容，我们下期视频再见。
20乔拓云.智能建站
03:28查看AI文稿AI文稿哈喽，大家好，今天我们讲一下 tenoner cs 中的网格自适应了，我们来看一下这种场景，这里有很多图标啊，我们想要他左右对齐，呃，不超过一行的时候呢，就是左对齐， 呃，还需要他换行啊？首先这里我们会想到使用弹性布局哦，换行 okay， 呃，排列的很整齐，但是有一个问题啊，他这个右侧 他没有顶边呢，左对齐没问题，右边没对齐，那这个时候呢？我们，嗯可以使用 用这个 justify between， ok， 这样就是说左对齐，右对齐也换行了， 就只有一个问题，当他不足一行的时候就出现问题了，他第二行的时候呢，他不足一行，他图标很少， 他也就是两边对齐，这个时候就看起来很不整洁啊，我需要的时候呢，呃，当他就是说最后一行不足一行的时候呢，我们需要他走在一起， 这个时候呢，这种情况下我们用那个，嗯， flag 布局是很难实现的，这个时候我们就要用到这个网格布局啊， 我们把它换成网格布局， grade， grade cos， 呃，写个十二 okay， 呃，这个时候网格布局的话，他一行排十二个， 我们收的时候呢，嗯，他最后一行也是左对齐，这种情况下看起来没问题啊，但他这个这种模式就有个缺点，就是当我们在移动端的话，就手机上看的话，他的图标会变得很小啊， 他这个这种情况下一行还是排十二个，这种情况下我们最好的做法是使用，就是他有个嗯， repeat 啊， repeat 里面写一个 autofill， 再写一个 min max， 这个图标是五十二个像素的宽度， e f r 保存 ok， 这个时候呢，他一行排了很多，就是在他有限的宽度内尽量排很多，而且手机上看的话，就他一行排的数量会会小很多。当我们搜索的时候呢，他也没有问题啊。 对，这个就是他的网格就自适应了， 非常完美啊，这就是我想要的效果。好了，关注我，教你更多 tylin 四 s 的技巧。
77程序员𝐋𝐞𝐫𝐭𝐞
05:08查看AI文稿AI文稿我忘了是哪个小伙伴给我评论还是私信来着，他说想把这个 e r 音 pro 做成动态的宽度，里边选的内容越宽，这个 e r 音 pro 它自动就变宽。那我们先来看一下为什么它不会自动变宽。好，我们检查一下这个元素， 大家看它里边实际上套了一个硬铺子，比如说他选择的这个 libo 会放到硬铺子里面，所以我们要想让整个组件变宽，要想办法让这硬铺子变宽。但是这个就好玩了，硬铺子他默认没有这个功能，所以这种情况我们通常都会利用 宽度是百分之百这个四 s 四来实现。比如说这是一个普通的硬铺的宽，然后呢，他在一个外部容器里，他的宽度是这个外部容器的百分之百，那我们通过修改外部容器的宽度，来让里边硬铺 动态的变宽。怎么修改呢？我们就在里边同步这个文本框的内容，文本框内容越多呢，它自然就撑宽了。所以呢，再回到刚才这个例子，我们就要想办法在这个音铺的同级，我们再放一个普通的元素来撑宽它。 那我们怎么放呢？我们可以利用这个 prefix 这个插槽说，我们在这加一个插槽， slot profix。 好，我们在这写一二三，先看一下效果， 大家看一二三上来了，那我们把它写多点哈，看能不能把它撑宽。大概没有撑宽，那原因是啊，一二影铺他默认把这个 prefix 设置成了 position 的 appas 露头，我把它勾掉，大概就撑宽了，但是呢，撑的特别 越宽，原因是硬铺的还有个宽度，他俩都成宽了，所以我们把硬铺的摆设成 pos， 一声对阿布斯路的让他不成。 好。然后呢，我们来简单写一下这个样式。好，我们首先在这定义一个 class， 这就叫到头没事来。好，然后呢，我们在下边这写一个样式， 我们这块呢，把这个拿过来 prefix 先把他的 posecan 设置成 relative， 然后呢，我们再把刚才这个 input 设置成 absolute， 还是我们这样 input 后最深等于 abbastlute。 好，我们来看一下刷新打开这回就可以了。然后呢，我们再把里边一二三替换成同步的内容。我们这块这样写，从欧布深里面去找 找这个选中的元素的 label， 点歪六等于歪六，找到的话呢，我们点 label 报错了，原因是这个有可能没找到，他默认上来是空的，没选择任何数据。所以这块 如果用六三的话可以用这个可选链，那我这个不是六三，可以这样把它和一个空的对象 打开，他就过来了。然后这个宽度不够宽，我们可以把它加一个默认的宽度，最小宽度在这 means 等于一百二。 好，打开这样。然后接下来我们让这个 precix 跟这个硬铺的对齐。我们先来检查一下硬铺的这个元素的布局， 大家看拍定左右是三十，然后还有一个包的，但是注意他这块是 boxs， 已经是包的 box， 所以呢，我们这块也成也要改成 box setting 等于包的 box。 然后呢，我们让他的写一个边框算了。然后呢，颜色的话我们用一个透明吧， 这个是透明。然后呢，我们再来左右的排顶，上下是零，左右是三十，然后呢高度，高度是四十，包括拉开，拉开也是四十。好，我们来看一下 啊。哎，差点，我们来看一下啊。这个 spa 错位了，你看一下他一个 pos 身是五，所以我们把这个 left 改为零，差不多对齐了，我们再来看啊， 好，差不多就可以了。然后我们再把这个元素隐藏起来，注意不能用 display noon， 因为我们要让他占位，所以得用 vis。 本来等于我们再来看一下。好，这样就可以了。
6759程序员小山与Bug
01:39查看AI文稿AI文稿怎么快速搭建一个像这样子唯美的自适应网站呢？今天就给大家分享桥托云平台的建站系统，只需一键套用模板，就可以快速的搭建一个网站。那我们先在他的官网免费注册，登录一个账号，就能进入他的产品中心。页面。找到企业网站，点击进入网站的后台管理页面。 在这里我们找到域名管理，先购买绑定一下网站的域名，然后点击概况。找到电脑网站中的去设计。点击进入网站的模板选择页面。这里有两种模板的选择方式，分别是标准模板和自适应模板。那这里我们选择自适应模板， 然后点击更多行业，还可以根据里面的各种行业分类或者输入关键词来快速锁定自己需要的模板。然后选择一个喜欢的，点击使用，就可以开始在线编辑自己的自适应网站了。这里我们可以直接点 点击网站的标题、栏目、横幅，以及里面的各种图片文字信息来进行修改与替换。那除了可以直接进行修改，页面左侧的工具栏也支持新增修改网站的模块、更换网站的主题样式、设置网站的基本组件，进行百度优化、生成小程序推广 等。我们将里面的各种信息全部都替换完成。之后，点击预览，还可以查看网站的效果。除了电脑端的效果，点击页面上的图标，还可以查看平板端以及手机端的网站效果。 确定这些效果都没有问题之后，我们回到编辑页面，点击保存发布。等发布成功之后，就可以拥有自己的网站了。同时在这个后台管理页面，我们也可以一键的管理，维护自己的自适应网站。还等什么呢？快去乔拓云选择模板搭建网站吧。以上就是今天分享的全部内容，我们下期视频再见。
17乔拓云.智能建站
