请选择 进入手机版 | 继续访问电脑版
搜索
我要展示 竞拍规则 竞拍管理
域名交易已结束 域名交易已结束 域名交易已结束 域名交易已结束 域名交易已结束 域名交易已结束
域名交易已结束 域名交易已结束 域名交易已结束 域名交易已结束 域名交易已结束 域名交易已结束
查看: 14345|回复: 200

自适应网站怎么做好些?

[复制链接]
发表于 2017-5-26 16:41:22 | 显示全部楼层 |阅读模式

现在自适应网站可谓是炙手可热,跟响应式网站一样备受企业或个人建站的青睐。自适应网站怎么做呢?一方面自适应网站的制作可以手写编程代码进行制作。此外还可以直接运用自适应网站模板直接制作,运用自助建站系统搭建,不需要懂代码,即可以快速制作一个自适应网站。在这里小编先给大家介绍一下利用编程的方式制作自适应网站。





1、在HTML头部增加viewport标签

在网站HTML文件的开头,增加viewport meta标签告诉浏览器视口宽度等于设备屏幕宽度,且不进行初始缩放。代码如下:

<meta name="viewport" content="width=device-width, initial-scale=1" />

这段代码支持Chrome、Firefox、IE9以上的浏览器,但不支持IE8以及低于IE8的浏览器。


2、在CSS文件尾部增加针对不同屏幕分辨率的规则

例如使用如下的代码,可以让屏幕宽度低于480像素的设备(如iPhone等),网页侧栏隐藏中部内容栏宽度自动调节。以下代码针对Z-Blog,WordPress相关标签名称只需修改一下即可。

@media screen and (max-device-width: 480px) {
  #divMain{
  float: none;
  width:auto;
  }
  #divSidebar {
  display:none;
  }
}


3、布局宽度使用相对宽度

网页总体框架可以使用绝对宽度,但往下的内容框架、侧栏等最好使用相对宽度,这样针对不同分辨率进行修改就方便。当然也可以不用相对宽度,那就需要在 @media screen and (max-device-width: 480px) 里面增加各个div的针对小屏幕的宽度,实际上更麻烦。


4、页面使用相对字体(非必要)

在HTML页面上不要使用绝对字体(px),而要使用相对字体(em),对于大多数浏览器来说,通常用 em = px/16 换算,例如16px就等于1em。


5、图片自适应(非必要)

img标签的话,只需要设置 max-width: 100%;或width:100%; 语句为:img { max-width: 98%; }

css加载的background-image如何自适应大小呢,其实CSS3中是可以实现的,添加如下语句:background-size:100% 100%;


其实,现在企业想要搭建一个自适应网站不用那么麻烦,直接借助自助建站系统就可以快速完成网站的搭建,这个大家可以了解一下成品网站,不需要懂代码,快速搭建一个自适应网站,节省企业建站的时间与成本。


了解自助建站系统:http://www.iisp.com/design/?s=lhp



西部数码爱米人社区,争做受米农欢迎的交流平台!
发表于 2017-5-27 10:23:06 | 显示全部楼层

点评

新后缀的资源丰富,找到适合站点的创意域名还是很有资源  详情 回复 发表于 2017-6-20 13:21
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-5-27 16:24:47 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-5-29 18:52:24 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-3 19:20:40 | 显示全部楼层
一个网站的核心是网站的内容和用户体验,域名只是网站的一个脸蛋,好看不好看,中用不中用还要看核心。
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-4 13:19:58 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-20 13:20:02 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-20 13:21:51 来自手机 | 显示全部楼层
元气哥哥 发表于 2017-5-27 10:23
新后缀选选还是有精品的!

新后缀的资源丰富,找到适合站点的创意域名还是很有资源
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-21 18:53:30 | 显示全部楼层
好米我也有,可惜人家看不上。
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-22 11:21:02 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-22 13:36:10 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-6-24 19:46:07 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-4 12:56:55 | 显示全部楼层
楼主说的不错,很有道理,学习了。
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-5 19:43:43 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-13 15:27:32 | 显示全部楼层
夏季,人心和天气一样的火热:正是好炒的季节。
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-13 17:39:00 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-15 18:35:55 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-17 17:13:22 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-17 18:24:18 | 显示全部楼层
玩域名的人,最大的优点就是持之以恒。
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

发表于 2017-7-19 11:19:22 | 显示全部楼层
西部数码爱米人社区,争做受米农欢迎的交流平台!
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

在线咨询|西部数码官网|小黑屋|西部数码域名论坛 ( 蜀ICP备12028237号

GMT+8, 2024-3-29 21:30

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表