如何使用html在标题图像上创建可单击按钮?

如何使用html在标题图像上创建可单击按钮?,html,Html,我想知道如何创建一个HTML格式的可点击按钮,它位于标题图像的中心 我曾尝试使用按钮标记和href属性以及img标记来尝试将代码包装到所需的图像上,但没有效果。我试图实现的结果示例可以在上的标题中找到。我不确定您是否只想要一个以标题图像为中心的按钮,或者是否有一个图像需要作为按钮的一部分进行样式设置。为了清晰起见,可以贴一张截图吗?下面是一个片段,它实现了前者 .标题{ 背景图片:url'http://lorempixel.com/640/200/'; 宽度:640px; 高度:200px;

我想知道如何创建一个HTML格式的可点击按钮,它位于标题图像的中心


我曾尝试使用按钮标记和href属性以及img标记来尝试将代码包装到所需的图像上,但没有效果。我试图实现的结果示例可以在上的标题中找到。

我不确定您是否只想要一个以标题图像为中心的按钮,或者是否有一个图像需要作为按钮的一部分进行样式设置。为了清晰起见,可以贴一张截图吗?下面是一个片段,它实现了前者

.标题{ 背景图片:url'http://lorempixel.com/640/200/'; 宽度:640px; 高度:200px; 文本对齐:居中; } .标题按钮{ 位置:相对位置; 最高:50%; 转化:translateY-50%; } 点击我!
你好,欢迎光临

首先,您应该始终发布一些代码,这样我们就可以看到您尝试了一些东西

我正在努力实现的目标可以在github.com的标题中找到

查看其构建方式的一个简单方法是使用浏览器中提供的一些开发人员工具检查此元素的代码,但请不要使用IE

如果你是HTML新手,你也应该尝试学习一些教程,阅读一些必要的文档,确保你不想错过那些花哨的CSS内容,所以你也应该去看看

现在谈谈你的问题


GitHub用于此按钮的是一个,您基本上希望使用一个带有背景图像的div结构,给它一个明确的宽度和高度,并将其位置设置为相对。然后,您可以在div中任意放置按钮。有几种方法可以做到这一点


这里有一个提示:你可以查看任何站点/页面的来源,并从中学习。