js 145

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>js 145</title>
  <link rel="stylesheet" href="style.css" />
</head>
<body>
<center>
<div class="container">
  <h1></h1>
</div>
見れれば、目はいいかも。<br>
<h2>10px</h2>
<l1>こんにちは〜。<br>
見えれば、目はいいんだよ。<small>多分…</small><br>
これが見えるなら、きっと…下も見えます。<br>…きっと。</l1>
<script src="script.js"></script>
<h2>8px</h2>
<l2>きっと、上もここも見えるはずです。<br>これでも全然小さくありませんよね。<br>スマホには拡大機能があるのですから。</l2>
<h2>5px</h2>
<l3>これは…見えないかもしれません。<br>
<big>でもこれは…見えますよね。</big><br>
じゃあ…これは?<br>
見えますか…?<l3>
<h2>3px</h2>
<l4>流石に、見えないと思います。<br>
見えるなら…<br>
あなたの目は…<b>凄い</b>です!</l4>
<h2>1px</h2>
<l5>もう見えません…多分。<br>
頑張って。見えるよ、きっと。<br>
では…さようなら。</l5>
<h4>これは見えます…よね。</h4>
</center>
</body>
</html>

@charset "UTF-8";

body {
  background: #f8f8f8;
}

l1 {
  font-size: 10px;
}

l2 {
  font-size: 8px;
}

l3 {
  font-size: 5px;
}

l4 {
  font-size: 3px;
}

l5 {
  font-size: 1px;
}
window.addEventListener('load', function() {
  document.querySelector('h1').innerHTML = 'js 145';
}, false);
Full page Open in App

about 1 year ago

10px~1pxを体験できます。

Pages


comments powered by Disqus