📣 第2週サイバーハッカーのクリーンアップ研究

30031 ワード
テキストリンク
1. HTML
htmlの基本を知りました。
👉 HyperText/Markup/Language

  • ハイパーテキストを最も重要な特徴とするタグ形式のコンピュータプログラミング言語.

  • 拡張子は.html
    • 👉 タブ
  • strong:字を深くします.
    • <strong>, </strong>
  • hで始まるラベル:タイトル処理、太い文字で飾られ、改行されます.数字が大きいほどフォントが小さくなります.
    • <h1></h1> , <h2></h2>
  • p:段落を作成します.
    • <p></p>
  • br:改行.
    • <br>
  • タグの構文
    -開始ラベル:<ラベル名>
    -終了ラベル:;不要なラベルもあります.
    • 👉 リンク
  • ハイパーテキスト.ドキュメントとドキュメントをリンクします.
    • <a></a>
    👉 ツールバーの

  • サイン情報だけでは足りない.機能を追加します.

  • href:リンク.
    • <a href="https://링크명">
<a href="파일명.html">
  • target:新しいラベルページを開き、ページを開きます.
    • <a target="_blank">
  • title:リンクにカーソルを置くと、詳細が表示されます.
    • <a title="세부설명">
  • サンプルコード
    • <a target="_blank" href="https://ko.wikipedia.org/wiki/%EB%8F%84%EB%84%90%EB%93%9C_%EC%BB%A4%EB%88%84%EC%8A%A4" title="전설적인 프로그래머">도널드 커누스</a>
    👉 リストとネスト
  • リストラベル:各アイテムはリストで区切られます.
    • <li></li>
  • groupping:リストとリストを区別します.同じ性格の人をラベルで組み合わせる.
    • <ul></ul>  //unordered list - 숫자 없음
<ol></ol>  //ordered list - 숫자 있음
  • ラベル内に別のラベルが存在する可能性があります.重ねて使用できます.
    • <ol>
<li>기술소개</li>
<li>기본문법</li>
<li>하이퍼텍스트와 속성</li>
<li>리스트와 태그의 중첩</li>
</ol>
<ul>
<li>최진혁</li>
<li>최유빈</li>
<li>한이람</li>
<li>한이은</li>
</ul>
    👉 ドキュメント構造
  • 追加ラベル:head 
    •  <title></title> //웹 주소의 이름을 바꿔준다.
     <meta charset="utf-8"> //글씨 깨지는 현상을 해결해준다.
  • 本文ラベル:body
  • 完全ラベル:html 
    • <html>
  <head>
  </head>
  <body>
  </body>
</html>
    👉 DOCTYPE
  • DOCUmentTYPE声明:ブラウザにこれらのラベルがどのような基準に従っているかを示します.
    • <!DOCTYPE html>
    👉 イメージ
    <img src="파일이름.jpg" width="100" height="100" alt="산 이미지" title="산 이미지">
// alt는 사진 대체 텍스트, title은 tooltip
    👉 入力フォーム(form)
  • は、ユーザが入力情報をサーバ
    • に送信することができる.
  • actionプロパティ:action内のurl(サーバ)に送信されます.
    • 👉 テキスト入力
    <input type="text" name="id" value="default value">
// name 속성을 이용하면, 전송 되었을 때 정보에 문자가 붙어서 전송된다.
    入力バーが表示されます.
    <input type="password" name="pwd" value="default value">
    文字数はわかりますが、内容は見えません.
    <textarea>default value</textarea>
    <input type="submit">
    コミットボタンが表示されます.
    👉 選択
  • の複数の選択肢から選択します.
    • <select name="color">
  <option value="red">빨간색</option>
  <option value="blue">파란색</option>
</select>
    赤
    色:青
    (オプションボタンの例)
    👉 ツールバーの
  • buttonはボタンのみを生成します.resetは上の情報をリセットします.
    • <form action="">
  <input type="submit" value="전송">
  <input type="button" value="버튼">
  <input type="reset"
</form>
    👉 データ転送→非表示
  • サーバに値を送信すると、hiddenを使用してデータ情報が非表示になります.
    • <form action="">
  <input type="text" name="id">
  <input type="hidden" name="hide" value="egoing">
  <input type="submit">
</form>
    👉 チェックボックスとコントロールのタイトル-label
  • という意味のブランドです.特别な机能X.视覚変化なし.各labelは、誰のラベルに接続する必要があります(方法2).選択した領域を拡大します.
    • <form action="">
  <p>
     * 방법 1 이름 지정하기 for, id
    <label for="id_txt">text</label>:
    <input id="id_txt" type="text" name="id" value="default value">
  </p>
  <p>
    * 방법 2 전체를 label로 감싸기
    <label>textarea:
      <textarea id="comment" rows="2">default value</textarea>
    </label>
  </p>
     * checkbox기능 할 때 유용하다.
    <label> 
      <input type="checkbox" name="color" value="red">붉은색
    </label>
 </form>
    text:
    password:
    textarea:
    赤
    👉 METHOD
  • サーバにデータを転送する方法
  • URLで後のデータを表示:get 
    • <form action="" method="get">
  • URLでデータを非表示にして転送するには、post
    • を実行します.
    <form action="" method="post">
    👉 ファイルのアップロード
  • ファイルをアップロードしてサーバにファイルを転送します.
  • ファイルアップロード機能を使用する場合、方法はpost、enctypeはmultipart/form-datです.
    • <form action="http://localhost/upload.php" method="post" 
enctype="multipart/form-data">
  * 이름 꼭 지정해주기
  <input type="file" name="profile">
  <input type="submit"> 
</form>
    IDEAでのMaven管理によるmysql依存の追加
    jdbc - preparedStatement