Html 对齐图像以适合网站标题的右侧_Html_Jekyll_Github Pages

Html 对齐图像以适合网站标题的右侧

html jekyll

Html 对齐图像以适合网站标题的右侧,html,jekyll,github-pages,Html,Jekyll,Github Pages,我目前正在尝试使用Jekyll主题和GitHub页面创建一个网站，但我遇到了一个问题。在我的index.html文件中，我想在介绍性文本的骑乘一侧添加我自己的图片。我试着这样做： --- layout: default title: stuff --- <!DOCTYPE html> <html> <head> <script src="https://polyfill.io/v3/polyfill.min.js?features

我目前正在尝试使用Jekyll主题和GitHub页面创建一个网站，但我遇到了一个问题。在我的index.html文件中，我想在介绍性文本的骑乘一侧添加我自己的图片。我试着这样做：

---
layout: default
title: stuff
---

<!DOCTYPE html>
<html>
  <head>
    <script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
    <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3.0.1/es5/tex-mml-chtml.js"></script>
  </head>
  <div id="PhotoOfMe">
    <img src="picture_of_me" alt="me" style="float: right;" width="150" height="150">
  </div>
  <div class="blurb">
    <h1>Website where keeps his stuff.</h1>
      <p>Currently a student of a bit of everything. <a href="/about">Read more about my life...</a></p>
  </div>
</html>

但这会导致如下结果：

图片与文本不对齐的位置。我如何着手解决这个问题？谢谢。

这是通过将其全部包装在一个文件夹中并将其样式设置为显示：flex来完成的

存放他的东西的网站。现在是一个什么都懂的学生

因为我的照片是100%宽度的，对不起，我没听懂。你说100%是什么意思？谢谢，这就解决了问题。这样做之后，有没有办法将图像的位置再向右调整一点？当然可以。只需将图像的边距更改为类似左边边距的值：10px。我改变了上面的答案。