随着越来越多的人使用手机上网，已经有很多的外贸网站在制作过程中采用了自适应的设计，以增加网站的用户体验，而好的网站内容也是必须要有的，虽说现在的网站都基本采用div+css来布局，但是像产品的描述部分有时候不可避免的会使用到table来编辑以达到更好的效果，这时候就会出现一个问题，就是当在手机上浏览时，使用了table的内容会有一部分被隐藏了，看不见，这当然不是我们想要的效果，下面我们来看看通过css来实现table也自适应！ CSS代码： .table-container { width: 100%; overflow-y: auto; _overflow: auto; [...]

外贸购物网站做的比较多，鞋子类的购物网站以前也接触过，只不过按照客户的要求，需要比较简洁的风格，所以首页显示的内容并不多，结构上依然是比较常用的上中下结构，头部是注册、登录、个人中心、搜索、logo、导航版块，中间没用用常用的通栏的Banner,面是分为了左右两个部分，左侧是一个产品的图片切换，右侧显示了一部分产品。在banner下方设计有两个广告位和一个自主编辑文字的地方。底部有关于网站的一些介绍，还有外贸购物网站都有的帮助中心和版权部分。 效果： banner的切换效果没有用常用的过渡效果，而是左侧先出来大图，右侧的小图然后再显示出来，有一些动感。网站整体以深灰色为主,多数地方以线条分割，总体上简洁、大方，其他像服装类的购物网站也可采用这种风格！

这是个印度医药的购物网站，客户希望网站整体和logo以深蓝色为主，我们想到医药主要想到了十字，logo我用一双手托着十字，是健康，有爱心的象征。 网站我主要也是以传统的左右两侧结构做的，左侧是产品分类以及联系我们，右侧即是展示相关内容，这样结构清晰且一目了然。新闻展示部分我以标题和简介相结合的方式展示，这样有利于网站优化。网站整体都是以深蓝色为主，部分图片是以红色为主，这样使得网站更加生动，不单一。内页跟传统的差不多，也是左右两侧，右侧主要展示该栏目的内容 这个印度医药的购物网站要求兼容手机，平板，这种左右结构更利于响应式设计。 下图分别是电脑展示和手机展示图。

随着智能移动设备的普及，以及3G、4G网张越来越多的覆盖，越来越多的人习惯在手机或者平板上浏览网页，传统的在PC上能正常浏览的网页，在手机或平板上要么显示不完整，要么显示的内容乱糟糟的，客户浏览体验非常差，这时候通常的解决办法是为不同的移动设备提供不同的网页，比如专门提供一个mobile版本，或者iPhone / iPad版本。这样做当然可以保证浏览效果，但是比较麻烦，同时要维护多个版本！ 不想这么麻烦，当然可以，自适应网页设计就可以解决这个问题，就是可以自动识别屏幕宽度、并做出相应调整，保证在各个设备下我们都能看到正常的网页，保证客户浏览体验！ 下面以Onepound外贸建站官网为例来看一下： 正常情况下浏览 屏幕变小，示做自适应处理前： 很明显我们发现出现了横向滚动条！ 下面我们来看看做了自适应处理以后的效果： 很明显，只是版块之间的间距变小了，但是内容都显示出来了，没有滚动条 [...]

这个国外鞋类购物网站整体我采用了天蓝色为主，和白色背景搭配，使得整个页面简洁，干净，部分图标颜色采用的淡绿色，整体又会给人一种清新，自然的感觉，使之不会过于单调。banner部分和产品图片部分都采用了浅灰色背景，增加了页面的层次感。产品类别的图片我用的是五边形，而不是普通的四边形，也使得页面比较立体，突出。页脚分为两部分，用了比较醒目的蓝色和天蓝色。内页我还是用的传统的左右结构，左侧产品类别，右侧产品列表，或是产品详情等。 这个国外鞋类购物网站也是我做的第一个响应式设计，兼容手机，平板，在做的过程中也花费了比较多的时间。 如果您有相关的网站需求，请与我们联系。