Как подвинуть текст внутри div?
Здравствуйте, как вариант использовать свойство position.

HTML
<div class="card">
      <img class="top-img" src="img\fon.png" width="480" height="180" />
      <h2>Базовый HTML</h2>
      <ul>
        <li>Базовые теги</li>
        <li>Теги картинок и ссылок</li>
        <li>Теги таблиц</li>
        <li>Служебные теги</li>
        <li>Кодстайл HTML</li>
        <p class="some-text">02</p>
      </ul>
    </div>

CSS
.card {
  background-color: white;
  width: 480px;
  height: 500px;
  box-shadow: 2px 4px 9px -4px #000000;
  position: relative;
}

.some-text {
  position: absolute;
  right: 0;
  bottom: 0;
}
думаю так лучше 
<div class="card">
<img class="top-img" src="img\fon.png"  width="100%" height="180" >
    <h2>Базовый HTML</h2>
<ul>
    <li>Базовые теги</li>
    <li>Теги картинок и ссылок</li>
    <li>Теги таблиц</li>
    <li>Служебные теги</li>
    <li>Кодстайл HTML</li>
</ul>
<h3>02</h3>
    </div>

.card {
        background-color: white;
        width: 480px;
        height: 500px;
        box-shadow: 2px 4px 9px -4px #000000;
        position:relative;
      }

      .card h3{
        font-size:50px;
        margin:auto 25px 25px auto;
        position:absolute;
        right:0;
        bottom:0;
        opacity:15%;
      }