css中aspect css扩展之aspect-ratio(纵横比)

以后界面基本框架不再每次提供,直接提供官方html和css实现代码,后面再做仔细研究

ul.picture-list

{

flow:h-flow;

padding:0;

border-spacing:2px;

}

ul.picture-list>li

{

display:block;

width:30%;

height:width(30%);

border:1pxsolidgreen;

}

ul.picture-list>li:nth-child(3n)//threeelementsintherow

{

clear:right;

margin-right:50%%;

}

Eachgreenrectanglehereshallmaintainaspectratio(10:3)whileresizing.

Somepicture1Somepicture2Somepicture3Somepicture4Somepicture5Somepicture6Somepicture7Somepicture8Somepicture9

如果觉得《css中aspect css扩展之aspect-ratio(纵横比)》对你有帮助，请点赞、收藏，并留下你的观点哦！