怎样懂得自顺应规划-百分百源码网

怎样懂得自顺应规划

发布时间：09/01 来源：未知浏览：关键词：

自顺应规划就是让网页能够自顺应的显示在不一样大小的终端设备上，它关于某些大型的网站来说兼容性好，代码高效但是由于它需要开发多个界面来顺应不一样的设备因此修改难度大

自顺应规划指的是能够使网页自顺应显示在不一样大小终端设备上的网页设计方式及技术。接下来在文章中将为大家详细介绍有关自顺应规划的知识，具有必然的参照价值，但愿对大家有所帮忙

【引荐课程：CSS教程】

自顺应规划：

自顺应规划的特点是在不一样的屏幕大小下设定不一样的规划格局。也就是说在某个屏幕下元素在这块地方但是换一个不一样尺寸的屏幕下，元素不必然还在本来的地方，有大概换了一个地方。它们主如果规划上的改动但元素并没有转变。这样的结果可以看成是不一样屏幕下由多个静态规划组成的

例：实现两端牢固中心自顺应的规划

<style type="text/css">
    p {margin: 0; }
    .left {width: 300px; height: 200px; float: left; background: coral; margin-left: -100%;}
    .right {width: 300px; height: 200px; float: left; background: lightblue; margin-left: -300px;}
    .middle {width: 100%; height: 200px;float: left; background: lightpink; }
span{
      display: inline-block;
      margin: 0 200px;
    }
</style>
 <body>
<div class="wrap">
    <p class="middle">
        <span class="inner">
            中心自顺应
        </span> 
    </p>
    <p class="left">左边牢固</p>
    <p class="right">右侧牢固</p>
</div>

结果图如下：