index.htm

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>keita kawase</title>

    <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=DotGothic16&family=Zen+Kaku+Gothic+Antique&family=Zen+Kaku+Gothic+New:wght@400;700;900&display=swap" rel="stylesheet">
    <style>
        @font-face {
      font-family: "Renner";
      src: url("./Renner.ttf") format("truetype");
      font-display: swap;
    }
    @font-face {
      font-family: "pc";
      src: url("./pc-98huu.ttf") format("truetype");
      font-display: swap;
    }
     @font-face {
      font-family: "fam";
      src: url("./fam.ttf") format("truetype");
      font-display: swap;
    }
        body{
            margin:0;
         font-family: "fam","pc";  
        }

      .navbar {
        position:fixed;
        top:0;
        left:0;
        width:100vw;
        
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: #ffffff00;
        padding: 15px 30px;
      }

      .navbar-logo a {
        font-family: "Zen Kaku Gothic Antique", sans-serif;
        color: #000000;
        letter-spacing:5px;
        text-decoration: none;
        font-size: 1.7rem;
        font-weight: bold;
      }

      .navbar-links {
        gap:30px;
        display: flex;
        align-items:center;
        list-style: none;
        margin-right: 70px;
        margin-top:0;
        padding: 0;
      }

      .navbar-links a {
        font-family: "Renner", sans-serif;
        letter-spacing:2px;
        font-weight:700;
        
        display:flex;
        align-items:center;
        
        text-decoration: none;
        font-size: 20px;
        transition: color 0.3s;
      }
      .navbar-links a img{

        margin-left:8px;
      }
      .navbar-links a:hover {
        color: #ff9900;
      }
      .i{
        border-radius:50px;
        padding:10px 35px;
        background:rgb(0, 0, 0);
        color:white;
      }
      .h{
        padding:10px 5px;
        color:black;
      }
      .hero{
        width:100vw;height:100vh;
        display:flex;justify-content:center;align-items:center;
      }
      .catch{
        font-size:6em;
        margin:0;
        font-family: "Zen Kaku Gothic Antique", sans-serif;

      } 
     



 .mi{
width:80%;

}
.box{
width:100%;
}
.icon{
border-radius:500px;
width:150px;

}
    </style>
</head>

<body>
<nav class="navbar">
      <div class="navbar-logo">
        <a href="#"><span style="color:black;">カワセケイタ</span></a>
      </div>
      <ul class="navbar-links">
        <li><a href="#" class="h">LINKS<img src="el.png" width="20"></a></li>
        <li><a href="#" class="h">WORKS<img src="el.png" width="20"></a></li>
        
        <li><a href="#" class="i">CONNTACT&emsp;→</a></li>
      </ul>
    </nav>
    <br><br><br><br><br><br>
    <h1 style="text-align:center;font-weight:normal;font-size:4em;">こんにちは、カワセ ケイタて゛す。</h1>
    <div style="text-align:center;font-weight:normal;font-size:3em;">ファミコン エミュレーターとか作って ます。</div><br><br>
<div style="display:flex;width:100vw;justify-content:center"><div style="border:4px solid black" class="mi">
<br>
<div style="text-align:center;font-weight:normal;font-size:3em;">自己紹介</div>

<div class="box">
<div style="text-align:center;">
  <br><br>
<img src="kabana.png" class="icon">
<h1 style="font-weight:normal">カワセケイタ</h1>
<div style="font-size:1.6em;">高校生を二年ぐらいやってる人。レトロゲー好き。CPUの仕組みに興味あり<br>好きな言語はjapanese、javascript、python、cです。<br>最近、作曲にハマりだした。ゲームは下手くそ、でも好き<br>誕生日は2010年の3月19日</div>
<br><br><br>
<img src="back.jpeg" width="400">
<br><br>
<div style="font-size:1.6em">なんか壁紙にでも使ってください。</div>
<br><br><br>
<div style="font-size:1.6em">当サイトの内容、テキスト、画像等の無断転載・無断使用を固く禁じます。<br>
また、まとめサイト等への引用を厳禁致します。<br>
お問い合わせはメールでご連絡をお願い致します。</div>
</div>
<br><br>
</div>
<h1 align="center">相互リンク</h1>
<div align="center">
<a target="_blank" href="https://blog.uliboooo.dev/about_me/">
<img class="img" src="uli_banner.png">
</a><br>
<a target="_blank" href="http://bps0x00.s341.xrea.com/index.html">
<img src="xbps-site-banner.png">
</a><br>
<a target="_blank" href="https://098orin.github.io/">
<img src="https://098orin.github.io/banners/200x40.png">
</a><br>
<a target="_blank" href="https://lygreen.github.io/">
<img class="img" src="https://lygreen.github.io/banner.svg" height="80">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=link1">
<img src="http://keitagames.com/links/banner.cgi?key=link1" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=link2">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=link2">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=link3">
<img src="http://keitagames.com/links/banner.cgi?key=link3" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=link4">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=link4" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=aaa">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=aaa" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=aab">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=aab" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=aac">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=aac" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=aad">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=aad" height="40">
</a><br>
<a target="_blank" href="http://keitagames.com/links/link.cgi?key=aae">
<img class="img" src="http://keitagames.com/links/banner.cgi?key=aae" height="40">
</a><br>
</div>
<br>
<div align="center">★★★&emsp;バナアはこちら&emsp;★★★</div>
<div align="center">相互リンクは<a href="https://keitagames.com/links/">ここ</a>から出来ます。</div>
<div align="center">バナーの大きさは200x40でお願いします。</div>
<br>
<div align="center"><img src="banana.png"></div>
<br><br>
</div></div>

</body>
</html>