横並びメニュー

横並びメニューの参考URL

〇初心者の為のCSS:コピペでOK！横並びナビメニュー10選<

https://www.e-sanwa.co.jp/sbs/column/20180323/

横並びflexについて

 〇もう迷わない！CSS Flexboxの使い方を徹底解説
https://webdesign-trends.net/entry/8148#CSS_Flexbox

配置したコード

〇どっちを使う？CSSで横並びのコンテンツ（Float or Flex）
https://www.w2solution.co.jp/tech/2020/09/29/%E3%81%A9%E3%81%A3%E3%81%A1%E3%82%92%E4%BD%BF%E3%81%86%EF%BC%9Fcss%E3%81%A7%E6%A8%AA%E4%B8%A6%E3%81%B3%E3%81%AE%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%EF%BC%88float-or-flex%EF%BC%89/#2

他のブラウザへの対処

〇2021年版：Flexboxの対応ブラウザとベンダープレフィックスまとめ
https://webdesign-trends.net/entry/8257

背景のみ透過のヘッダーナビゲーション固定

白背景（RGB値）、50％透過↓

div {
  position: fixed;
  top: 0;
  left: 0;
  margin: 0;

  background: rgba(255,255,255,0.5);
}

marginは余白をなくす

色のRGB値を調べる↓

〇RGBと16進数カラーコードの相互変換ツール - PEKO STEP

https://www.peko-step.com/tool/tfcolor.html

-------------------------------------------------------------

 参考URL

https://www.design-memo.com/coding/css-rgba-opacity#:~:text=%E8%83%8C%E6%99%AF%E3%81%AE%E3%81%BF%E9%80%8F%E9%81%8E%E3%81%95%E3%81%9B%E3%82%8B%E6%96%B9%E6%B3%95,%E3%81%99%E3%82%8B%E3%81%93%E3%81%A8%E3%81%8C%E3%81%A7%E3%81%8D%E3%81%BE%E3%81%99%E3%80%82&text=%E4%B8%80%E7%95%AA%E5%B7%A6%E3%81%8C%E4%BD%95,%E3%82%92%E4%B8%8B%E3%81%92%E3%81%9F%E7%8A%B6%E6%85%8B%E3%81%A7%E3%81%99%E3%80%82

------------------------------------------------------------