所以我想要的是在给定的H1主标题左侧有一个图标。不幸的是,到目前为止我没有找到任何方法来实现这一目标。一个潜在的变体是为两者编写裸骨HTML,但是,我没有从标题中获得降价的好处。 无论如何知道更好的方法吗?
首先要展示我真正想要的是这个(这是用图片编辑器进行的演示):
我试过这个:
![image-title-here](https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png)
# Quite a long title, potentially going over several lines
这根本不起作用
![](https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png){:style="float: right;margin-right: 7px;margin-top: 7px;"}
# Quite a long title, potentially going over several lines
{:style =" float:right; margin-right:7px; margin-top:7px;"}
像这样使用html,无法识别降价:
<p align="center">
![]((https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png)
</p>
&#13;
还使用直接html:
<div style="float: left;"><img src="https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png" width="128" height="128"/></div>
# Quite a long title, potentially going over several lines
&#13;
如果标题不在新行上,则不会将其识别为降价。
编辑建议的答案在stackoverflow上看起来是正确的,但在我的github上它看起来像这样:
问题是我们可以让标题与图像的顶部对齐吗?
答案 0 :(得分:2)
我在GitHub项目存储库README.md文件的标题之前使用了图像html标签和一个空格。在左侧设置我的图片,在右侧设置标题。这是它的代码。
<img align="left" width="80" height="80" src="https://raw.githubusercontent.com/akarsh/akarsh-seggemu-resume/master/akarsh%20seggemu%20resume/Assets/Assets.xcassets/AppIcon.appiconset/Icon-App-60x60%403x.png" alt="Resume application project app icon">
# Resume application project
You can see the project readme by clicking on this link to the GitHub repository
答案 1 :(得分:1)
坏消息,GitHub不支持README.md文件中的完整HTML元素集。 Here is a write-up关于支持 的内容。我在4年前的this StackOverflow question中也发现了一点。
该问题中提到的资源之一是this whitelist。
如果它有用,你需要的是类似于下面的内容,我保留供你参考。描述针对您的问题描述。不幸的是,看起来GitHub会覆盖style
属性,将其替换为width: 100%
,并强制文本包裹在图像下方。
应该起作用(但不是):样式附加到图像本身。将其附加到div
会影响整个div。注意:<h1>
包含图片和文字。
<h1> <img src="https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png"
width="128"
height="128"
style="float:left;">
# Quite a long title, potentially going over several lines and on and on and on and on and on and on and on and on and on