CSS CSSでフッターをウィンドウ下部かページ最下部に表示する
CSSでフッターをウィンドウ下部に表示する。（ページの高さが１ページない時も下に張り付いたままにする。高さが1ページ以上あるときはページの一番下に配置する。）方針ページのスクロール中は表示させない。基本的にはページの最下部に表示させる。ペー...
css
CSS 
Javascript Javascriptで目次のハイライト
サイドバーにある目次の現在項目を項目を分かりやすくするためハイライトするようにした。更新2021/11: 折りたたみ要素の展開などでページの高さが変わってもハイライトがずれないようにしました。経緯長い記事を読むとき、目次にハイライトがないと...
Javascript JavascriptでCSSアニメーションを埋め込む
Javascriptを使ってCSSでアニメーションさせる。アニメーションはCSSに任せるJavascriptでは上手に書かないとアニメーションの動作が滑らかにならないので、アニメーションはCSSに任せる、という方針です。とてもちょうどいいM...
CSS React+CSS 要素の位置を選択して切り替える
reactで要素の位置を選択して切り替える。ReactとCSSでおこなった。reactで要素の位置を9個の選択肢から選んで変更できるようにする。選択肢は8方向と中央。選択肢の提示方法はCSSで調整した。グリッドレイアウトを使用。要素の配置決...
CSS 入れ子のul/olのmargin-bottomを調整した
このブログのolとulのCSSを調整した。更新履歴2022/12: 再現性を確保したコードに修正。より良い手段を記載。環境2022/12追記: wordpressかどうかはあまり重要ではないけど一応載せておく。2バージョンで確認。wordp...
React create-react-appでのアプリにnode-sassを入れた時のエラー
create-react-appで作成したreactアプリでscssを使おうとしたら、エラーが出たときのメモ2022/03追記: node-sassでなくsassモジュールを使うべき（後述追記参照）環境package.jsonは次の通り: ...
CSS CSS フレックスボックス利用のメモ
display: flexの個人的整理使うたびに色々なサイトを巡ってしまうのもアレなので、自分のページのサイト内検索で済むようにしたくてここに整理しておく。詳細はMDNのフレックスボックスのガイドページを見るべき。ここ:CSS フレックスボ...
CSS 3通りのmarquee
幅が足りない時は文字をスクロールさせる。（マーキー）電光掲示板のようなスクロール。局所的には使える。試した方法3つmarqueeタグ（廃止）を利用CSSのanimationを利用Javascriptで実装特に凝った動きをしないのであれば、真...
CSS CSS position: absolute;の要素の中央寄せの2種の方法
position: absolute;な要素の中央寄せのメモ2021/01追記: 各見出しを修正translateを使う調べてみると、transform: translate(-50%);を使ったものが多い。#parent { positi...
CSS CSS text-shadowメモ
CSSのtext-shadowメモ仕様（簡単に）text-shadow: offset_x | offset_y | blur | color;offset_x左右方向の影の位置。0だとテキストと重なる。このときでも、blurが大きければ、...