HTML

プログラミング

【CSS】スクロールバーをカスタマイズする

-webkit-scrollbarを設定する。index.html<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <title>【CSS】スクロールバーをカスタマイ...
プログラミング

【CSS】マーキーを実装する

divタグにclass属性を指定し、pタグの animation を設定する。index.html<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <title>【C...
プログラミング

【HTML】表を作成する

tableタグ、trタグ、thタグ、tdタグを使用して作成する。<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <title>【HTML】表を作成する</title...
プログラミング

【CSS】メニューを横並びに配置する

ulタグの display を flex に設定する。index.html<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <title>【CSS】メニューを横並びに...
プログラミング

【CSS】ヘッダーをページ上部に固定する

headerタグの position を sticky に、top を 0 に設定する。index.html<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <tit...
プログラミング

【CSS】2行目以降の行頭を揃える(ぶら下げインデント)

margin-left と text-indent を設定する。index.html<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <title>【CSS】2行目以...
プログラミング

【HTML】ファビコンを設定する

ファビコンに使用するicoファイルを用意し、headタグの中に以下の1行を追加する。<link rel="icon" href="favicon.ico"><!DOCTYPE html><html lang="ja"> <head> <me...
プログラミング

【p5.js】スケッチを画像としてダウンロードする

canvas要素をtoDataURL()メソッドで画像データに変換し、aタグのリンク先のURLに指定することで画像ファイルとしてダウンロードできるようにする。そして、bodyタグの最後の行に以下の1行を追加する。<script src="s...
プログラミング

【p5.js】スケッチをWebページの背景に設定する

style()メソッドでcanvas要素の z-index を -1 に設定する。index.html<!DOCTYPE html><html lang="ja"> <head> <meta charset="utf-8"> <title>...
プログラミング

【p5.js】p5.jsをCDNから読み込む

headタグの中に以下の2行を追加する。<script src=""></script><script src="sketch.js"></script>index.html<!DOCTYPE html><html lang="ja"> <...