TIL 2021.09.17-1週間

13965 ワード
html CSS TIL テキストリンク
📍今週の学習目標
  • 学習ネットワークプログラミング基礎
  • HTML/CSSを使用してWebサイト
    • を公開
    学習
  • Linux
    • 学習
  • Git
    今日習った内容💪
  • html,学習css創建ウェブサイト
    • <今日の復習内容>
    1.背景属性
    2.y軸の位置合わせ方法
    3.フェラーリ効果とは?
    4.inputラベル
    1.背景属性
  • 背景属性
    • /* background가 가지는 속성과 순서는 아래와 같다 */
.background{
   background-color: red;
   background-image: url();
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-position: top;
}
   background-size: auto | length | cover | contain | initial | inherit
}
    2.y軸の位置合わせ方法
  • y軸揃え方法
    y軸の位置合わせ方法はいろいろありますが、私は1つしか勉強していないので、チェックしてください.
    中央ソートをどのように適用するかも考えてみましょう.
    • {
/* position 사용할때 y축 중앙 정렬 하는법 */
  top: 50%;
  transform: translateY(-50%);

/* x,y축 중앙 정렬 하는 방법 */
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
    3.フェラーリ効果とは?
  • パターン効果とは?
    =主にウェブサイト上でスクロールするにつれて、オブジェクトや背景画像が時間差とともに変化する技術を指す.ますます多くのページが平行スクロールを使用しており、ユーザーとのインタラクティブ性を高め、好奇心を奮い立たせ、見た目も魅力的なページを作ることができます.
    • /* background image를 attachment fixed로 주는 걸로 간단하게 패럴랙스 효과 만들기*/

.parallax{
    background: url('background-image-넣기') no-repeat fixed;
    background-size: cover;
}
    そうですね.私は最近、アップルのホームページのように面白いページだと思っています.スクロールするにつれて、ページがきらびやかになり、3 D階層に入ったUIが表示され、Parlax効果であることがわかりました.私もそうしたい
    4.inputラベル
    inputタグの使用率が高いのでよく使われていますが、labelと一緒に使うことを知ったのは初めてです.きょう習ったばかりの部分を調べる
  • 入力ラベル-text、email、tel、password 
    • <label for="topic">제목</label>
<input type="text" id="topic" name="topic">

<label for="email">이메일 주소</label>
<input type="email" id="email" name="email"> 

    = 이와같이 label 태그와 함께 사용 해준다.
  • labelラベルとは?
    =labelラベルはラベルと同じ役割を果たします.フォーム入力ウィンドウの要素のタイトルが表示されます.Inputラベルとともに使用すると、ユーザーの使いやすさが向上します.たとえば、上記の例では、「タイトル」というテキストを選択するだけで入力ラベル内の入力ウィンドウにアクセスできます.また,Webアクセス性のために利用する必要がある.スクリーンリーダーのような通信装置は、labelタグを介して接続された入力タグを識別することができる.
  • 入力ラベル-チェックボックス、radio
    =チェックボックス再検査可能/非無線再検査可能
    • 	  <label for="html">
              <input type="checkbox" id="html" name="html">html
          </label>
          <label for="css">
              <input type="checkbox" id="css" name="css">css
          </label>
	  <label for="js">
              <input type="checkbox" id="js" name="js">js
          </label>
          
          <label for="male">
              <input type="radio" id="male" name="gender">M
          </label>
          <label for="female">
              <input type="radio" id="female" name="gender">F
          </label>

	= 이와 같이 만들면 checkbox는 중복 체크 가능하게,
	 radio는 중복 체크가 불가능하게 만들 수 있다.
    Mycatの論理ライブラリ、テーブルスライス構成
    【実戦演習】データベース基本知識と原理シリーズ04-Mysqlデータベース主従レプリケーション