響應式理解

響應式是指：在不同寬度的屏幕下，都可以看到完整的頁面內容，只不過，在寬度較小的屏幕下，可能內容會有刪減，佈局可能會有些改變等。響應式一般會使用 CSS3 媒體查詢 @media 來實現。（PC端響應式多定義了幾次CSS樣式，然後在不同寬度的屏幕下顯示出來，覆蓋之前的CSS樣式。）

如下：

.box{
    width: 1024px;
    height:40px;
    background:red;
    margin:0 auto;
}

@media screen and (max-width:1023px){    /*當屏幕小於1000px時執行*/
  .box{
        width: 100%;
        padding:0  25px;
        box-sizing:border-box;
    }
}

@media screen and (max-width:700px){     /*當屏幕小於700px時執行*/
  .box{
       padding:0 15px;
    }
}

【個人見解】