类似这样的网站在wordpress上可以实现吗()

尝试创建类似于此主题的网站https://www.beefitswhatsfordinner.com/, 在WordPress上可以实现吗?
我正在尝试避免使用代码, 因为我将使用插件, 但以下是我目前正在尝试的方法。
平台是wordpress, 页面构建器是elementor, 此HTML代码段位于elementor块的HTML标签内

< sectiona> < ul> < li> < a> Button 1 < /a> < img src="http://www.srcmini.com/wp-content/uploads/2019/11/1.jpg"> < /li> < li> < a> Button 2 < /a> < img src="http://www.srcmini.com/wp-content/uploads/2019/11/2.jpg"> < /li> < li> < a> Button 3 < /a> < img src="http://www.srcmini.com/wp-content/uploads/2019/11/3.jpg"> < /li> < li> < a> Button 4 < /a> < img src="http://www.srcmini.com/wp-content/uploads/2019/11/4.jpg"> < /li> < li> < a> Button 5 < /a> < img src="http://www.srcmini.com/wp-content/uploads/2019/11/5.jpg"> < /li> < li> < a> Button 6 < /a> < img src="http://www.srcmini.com/wp-content/uploads/2019/11/6.jpg"> < /li> < /ul>

< style> sectiona{ position: absolute; width: 100%; height: 100vh; }ul{ width: 100%; background: rgba(0, 0, 0, .2); box-sizing: border-box; -moz-column-count: 2; -moz-column-gap: 2px; -webkit-column-count: 2; -webkit-column-gap: 2px; column-count: 2; column-gap: 2px; text-align: center; } ul li { list-style: none; } ul li a { display: block; top: 0; text-align: center; line-height: 50px; color: #fff; font-size: 24px; cursor: pointer; transition: 0.5s } ul li a:hover { background: #ff0; color: #000; } sectiona img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -2; transition: 1s; opacity: 0; }ul li a:hover + img { opacity: 1; } < /style>

#1WordPress只是一个CMS。
因此, 你可以使用它来构建任何站点, 最困难的部分是前端。
【类似这样的网站在wordpress上可以实现吗()】你可以扩展帖子类型并添加帖子类型, 添加类别以实现更复杂的内容结构。

    推荐阅读