javascript - How to implement the layout style of Toutiao picture channel?

Today’s headline picture channel toutiao.com/news_image

The picture layout style of Toutiao is as follows. I only took two screenshots. After looking at them, they seem to be random styles (3 picture styles, 1 picture style)

How to use PHP to implement this (or how to use PHP to output different styles? When to output three image styles? When to output one image style, or to output randomly [random output usually changes when refreshing the web page])?

Reply content:

Today’s headline picture channel toutiao.com/news_image

The picture layout style of Toutiao is as follows. I only took two screenshots. After looking at them, they seem to be random styles (3 picture styles, 1 picture style)

How to use PHP to implement this (or how to use PHP to output different styles? When to output three image styles? When to output one image style, or to output randomly [random output usually changes when refreshing the web page])?

The pictures are divided into three styles, .small .middle .large
Each style has fixed width and height
Three pictures, .middle style floats left, .small style two floats right
The layout is like this

For such an irregular picture arrangement, if there is only one link, just take a screenshot and put it up. If there are links in each block, just draw hot spots. Anyway, it is irregular