FE BE 개발 메모장/HTML& DOM & CSS

form과 link 태그

FORM

입력 양식 전체를 감싸는 태그

<form action="" method=""> </form>

form 태그의 속성들

name: form의 이름, 서버로 보내질 떄 이름의 값으로 데이터 전송

action: form이 전송되는 서버 url 또는 html 링크

method: 전송 방법 설정. 

  -get: URL 끝에 데이터를 첨부해서 전송하는 방식

          항상 노출이됨.

          URL 최대 256자까지(초과시 데이터 잘림)

          URL 인코딩방식 base64

          영문자와 숫자정도만 전송

   -post: 패킷의 본문 안에 데이터를 넣어서 전송하는 방식

             제한 크기 무제한

             데이터 노출 없음

             한글 상관 없이 전송

autocomplete: 자동완성. (on으로 하면 form 전체 자동완성 허용)

accept-charset: 폼 전송에 사용할 문자 인코딩을 지정

 

Form의 다양한 요소(element)

 

<fieldset>,<legend>

 

<form action="" method=""> 
  <fieldset>
    <legend>회원 정보</legend>
    이메일: <input type=text class="input mail-i">
    이름: <input type=text class="input name-i">
  </fieldset>
</form>

 

LINK

<link rel="stylesheet" type="text/css" href="path/aa.css"

link 태그의 속성과 값들

rel : 현재 문서와 링크된 문서와의 관계를 지정한다.[필수작성]

  - help : 도움말 문서에 대한 링크를 제공.

  - author : 해당 문서의 저자에 대한 링크 제공.

  - alternate : 프린트 페이지나 번역되 ㄴ페이지와 같이 해당 문서의 대체 버전에 대한 링크 제공

  - search : 현재 문서 및 관련 페이지를 검색하는데 사용할 수 있는 리소스에 대한 링크 제공. 

  - license : 해당 문서의 저작권 정보에 대한 링크를 제공

href : 링크된 외부 리소스의 URL을 명시한다.

referrerpolicy: 리소스를 가져올 때마다 referrer을 지정한다.

  - no-referrer  : referrer 헤더가 전송되지 않음.

  - no-referrer-when-downgrade : Referrer가 HTTPS없이 Origin으로 이동할 때 헤더가 전송되지 않는다. 

  - origin : 머리글에 원본만 보낸다. (https://a.com/page.html => https://a.com/)

  - origin-when-cross-origin : 동일한 프로토콜로 동일 출처 요청을 수행할 때 origin, path, querystring을 보낸다. 원본 간 요청 및 보안 수준이 낮은 대상은 origin만 전송한다.

  - unsafe-url : 보안과 관계없이 요청을 수행할 경우, origin, path, querystring을 보낸다.

type :  링크된 콘텐츠의 타입을 정의한다. (ex.) text/html, text/css)

 

 

 

 

ref: "W3School", "form태그", "W3School2","link","MDNHTTPReferrer","MDNLink"

'FE BE 개발 메모장 > HTML& DOM & CSS' 카테고리의 다른 글

HTML 5의 시멘틱 요소  (0) 2021.06.03
label  (0) 2020.11.28
input  (0) 2020.11.25
HTML(Hyper Text Markup Language)  (0) 2020.11.13