目錄

• • 實現一個盒子在父盒子內的垂直水平居中
  • 如果你在專案中引入一段html程式碼，怎麼給它設定樣式？

實現一個盒子在父盒子內的垂直水平居中

//父相子絕後，子分部向左向上移動本身寬度和高度的一半（也可以用 transform:translate(-50%,-50%)）最常用方法

     #child{
         position: absolute;
         left: 50%;
         top: 50%;
         margin-left: -100px;
         margin-top: -100px;
         //transform:translate
 
(-50%,-50%) //不知道子盒子寬高情況下
     }

//彈性佈局方法 父盒子新增如下程式碼
#parent{
	display: flex;
    justify-content: center;
    align-items: center;
}

//定位+外邊距適應法 
#child{
	position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

如果你在專案中引入一段html程式碼，怎麼給它設定樣式？

樣式穿透

正則替換

把html程式碼在需要修改的標籤使用正則替換為帶有行內樣式的標籤（治標不治本）

res.data.content.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ')