CSS

a:link{ color: black;} : リンク(文字列）の色を変える。

　リンク文字列（通常青、クリック履歴があると紺色）の文字色を変える。クリック(visited)後に色を変えない。
CSSのリンクの色を変えない方法を現役エンジニアが解説【初心者向け】 | TechAcademyマガジン
a:link, a:visited, a:hover, a:active {
color: blue;
}

background-color : rgba(r,g,b,a ) : 文字はそのままで背景のみを透明委する

CSSで背景の色や画像を透過させる方法を覚える (shu-sait.com)

• rはred(赤)
• gはgreen(緑)
• bはblue(青)
• aはalpha(透明度) 0～１の範囲で透明度を設定。０は完全透明。

color コード : 文字、背景のカラーコード表

Microsoft VisualStudio 色コード一覧表 (ao-system.net)

display : displayの要点

display:inline http://kawana.wp.xdomain.jp/information/20210430/1043/
・inlineの要素は、CSSで幅（width）と高さ（height）を指定することができません。
　inlineの要素の幅と高さは「要素の中身」に応じて決まります。つまり「テキストの長さ」や「文字の大きさ」により幅と高さが
　自動で決まるわけですね。

display:flex cssで要素を横並びにする方法まとめ – Qiita
・要素を横並びにする。<div>等のinline要素。

float : ボタン表示に関するＣＳＳ

CSSのfloatとclearで簡単に段組レイアウトを作る方法 [ホームページ作成] All About
詳細：float : left – Kawana Lab (xdomain.jp)

<input type=”submit” : ボタン表示に関するＣＳＳ

submitボタンをデザインする (cman.jp)

<style type="text/css">
.button {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 18pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 12px;   /* 余白       */
  background    : #000066;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
  border        : 2px solid #000066;    /* 枠の指定 */
}
.button:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
</style>

margin : auto : ブロック左右のマージンを均等にする。→　親ブロック内の中央の位置になる。

.top-title>h1{     margin-left: 100px;    width:50%;

overflow-x　: スマホの横スクロールを実装

CSSだけでスマホの横スクロールを実装する｜株式会社TORAT｜東京都中央区のweb制作会社

//page-zhongwen-** 関連のcustom-style.css
@media (max-width: 991px) {
.site-main{    
overflow-x: auto;  /* 横スクロールの指定 */   
 /*white-space: nowrap;  /* 横スクロールの指定 */
 /* overflow-scrolling: touch;  /* スクロールを滑らかにする */
 /*-webkit-overflow-scrolling: touch;  /* スクロールを滑らかにする */
 margin: auto; 
width:90%; //数値を小さくすると.site-mainよりはみ出る範囲が広くなる。
}

.top-title>h1{　: 特定の親要素内の子要素を指定する。

.top-title>h1{     
margin-left: 100px;    width:50%;
｝

.top-title>menu>ul では機能しない。？

.?????:nth-child(2n+1) : tableで1行毎に背景色等を変更する。

CSSでtable 行の背景色を1行ごとに変える方法 | ビギブ (beginnerweb.net)

.chart-zhongwen:nth-child(2n+1){    
　background-color: #B0E0E6;}

submit ボタンのデザイン : submit ボタンの各種特性指定

submitボタンをデザインする (cman.jp)

<style type="text/css">
.button {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 18pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 12px;   /* 余白       */
  background    : #000066;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
  border        : 2px solid #000066;    /* 枠の指定 */
}
.button:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}

text-align : center : ブロックの中央寄せ⇒　文字のみ中央になリブロックは中央にならない。

【CSS】初心者必見！CSSで要素を中央揃えにする簡単な方法！【追記有り】 | テラソリューション (terasol.co.jp)

ブロック要素には　text-align:center は無効。desplay:inline で インライン要素にする。

<div class=”parent”>
<span class=”item”>インライン要素</span>
</div>

.parent{
text-align:center;
}

セレクター :「＃」、「.」など

各種セレクター：セレクタの種類－CSSの基本 (htmq.com)

クラスセレクター　:　　要素名.クラス名　　＊.pastoral{ }
IDセレクター　　 ： 要素名.ID名　　　　h1#chapter1{ }