纯AI建站实操第六期原创

不用写代码，不用懂设计，用AI快速做网站的技巧。话不多说，强哥今天接着给大家上实操，我们今天主要给大家讲一个场景，就是鼠标经过卡片的时候出现不同的内容，这样的场景怎么去做？比如我现在想把这个电力能源、煤炭能源，还有金融能源以及环保能源改成卡片式的，那我应该怎么去改？首先我可以删除掉这个区域。然后我可以给AI说啊，我我需要做一个。标签切换的效果，鼠标点击不同的标签。出现不同的内容。然后第一第一块我们要告诉他我们有哪些标签啊啊。标签有4个，在一行显示。然后我们有。

电力能源、煤炭能源、金融能源。电力人员。煤，煤炭。还有一个。环保的。然后第二块我们要告诉他每一个标签下面的排版是怎么样，那我们要说每个标签下。采用做。图右文的排版模式包含。图片。标题、简介和按钮。那我们。就这样的提示告诉他，从逻辑上来说，AI是一定可以生成出来的，那我们现在直接把提示给他，看AI能不能成功生成出来。

OK.你们可以AI已经帮我们把它生成出来了，但是他做的标签是靠左的，如果我们需要去让AI帮我们改成居中的是可以的啊，然后我们保存成功以后预览一下。看一下这个切换的效果出来了没有。看到吗？那我们的切换效果就出来了，AI是可以成功帮我们生成出来的。那我们生成出来了以后，我们可以换一下图片试一下啊。有任意的选择人。他甚至把这个图片的比例可能都告诉你了啊。那么。第二个标签我们怎么去画呢？我们这里只能改它的文字，看到吗？但是我们如果我们想要改第二个标签的图片或者文案，应该怎么改了？因为没办法直接切换，所以在这里我们就需要借助到我们的页面元素的功能来进行更换了，那我们首先选一下这个元素，你会发现首先这里上面是一个div，下面是一个div，我们在第一个div里面是包含了有图片。以及标签的，那我们找到第2个标签，这张图片就是。

第二，第一个标签在这里看到吗？我们选中的时候，它是在这里的，我们可以把它收缩一下。第二个标签在这里，因为每一个标签下面都会有不同的标签加图片，还有H3是指标题，P标签是指文版，还有按钮啊，按钮是用A标签做的，所以我们要找第二个卡片，我们就需要在这里来找了，第二个卡片是指这里，然后这里一个image啊图片标签，我们选中它以后，我们再点属性设置，我们就可以去更换第二张图片了，你看它的图片也告诉你是叫煤炭能源，我们随便选一张图片好吧。我们。我们保存一下，看一下它生效了没有，好吧。然后我们预览。看到吗？所以如果要更换对应的图片，就是这么去更换了，包括我们需如果需要更换文案也是一样的，我第一个标签是可以这样去更换的，那么第二个标签我应该怎么去更换了，所以我先找到他这里，然后第二个标签在这里，然后如果说我需要改，改变它的里面的这个标题或者简介，对吧。

那我要改简介，你看因为先进的文炭技术，我在这个后面加个1啊。看我第二个标签的简介，第二个标签的简介应该就已经改掉了。看到吗？这是我们刚才加上去的，所以怎么去修改，这个也一起教大家，今天我们就讲这么多，下期我们接着再讲其他的。