width,min-width,max-width三者的区别及如何使用

因为是三个属性，会存在，仅用其中一个，或则两个一起用，或则三个一起用的情况，下面我们一一讲解。

1.仅使用其中一个的情况，并且输入的是px值的时候（例如此时输入的是500px）

500px	自适应	默认显示宽度	自适应范围	滚动条
width:	否	500px	无	小于500px时出现
min-width:	是	100%	500px-100%	小于500px时出现
max-width:	是	500px	0-500px	不会出现

2.仅使用其中一个的情况，并且输入的是%的时候（例如此时输入的是80%）

80%	自适应	默认显示宽度	自适应范围	滚动条
width:	是	80%	全部	无
min-width:	是	100%	全部	无
max-width:	是	80%	全部	无

3.两两结合情况
        3.1不建议width+min-width和width+max-width这样结合使用，这样结合使用其实就是width特性，没有任何min-width和max-width的特性出现。
        3.2建议使用Min-width+max-width，这样的效果就是，默认显示宽度是max-width，自适应的区间是，min-width和max-width之间，小于Min-width就会出现滚动条。

所以总结一下，我们只会使用4中形式，单独使用width，单独使用min-width,单独使用max-width，结合min-width和max-width这2个使用。

具体的效果大家可以自己在代码里面试试更有感觉