Newer
Older
2020-Y.ryusei / kadai2.html
@ryusei ryusei on 14 Jul 2020 1 KB edit file
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>CSS3の世界</title>
    <link rel="stylesheet" href="kadai.css" type="text/css">
  </head>
  <body>
    <header><span>CSS3ってすごい</span></header>
    <div>
      <nav>
        <h1 class="center">一覧</h1>
        <ul>
          <li><a href="https://www.yatex.org/gitbucket/koekiInfoDesign/2020-Y.ryusei/pages/kadai.html#">猫</a></li>
          <li class="now">草むらにいる猫</li>
          <li><a href="https://www.yatex.org/gitbucket/koekiInfoDesign/2020-Y.ryusei/pages/kadai3.html#">混ざっちゃった猫</a></li>
        </ul>
      </nav>
      <main>
        <div class="back1">
          <img style="mix-blend-mode: normal;" src="cat.PNG" alt="猫" width="500">
        </div>
      </main>
    </div>
    <footer>
      <p>今回使ったのはflex-direction等のフレキシブルレイアウト、画像の合成にmix-blend-mode、画像ボーダーにborder-imageの3つ。どれも便利だし面白い</p>
    </footer>
  </body>
</html>