16.05.23수업 - govl2233/project_studyej GitHub Wiki

tag

  1. block
  2. inline

block : h1~h6/table/ul,dt,dd/p 등등 용도 : 레이아웃구조를 만들때 사용하는 속성의 엘리먼트. 특징 : 개행(줄이바뀜)

★( inline 속성태그를 block이 감쌀수있음)

★block 에서 <div></div> : 하나로 묶어서 그룹으로 사용할때.(영역을 잡아줄때 사용) (아무의미없음)

inline : input/span/strong 등등 용도 : 레이아웃 안에 컨텐츠를 꾸밀때 사용하는 속성의 엘리먼트. 특징:줄이안바뀜

★(단,block 태그를 inline이 감싸지 못함)

★inline 에서 <span></span> : 한줄에서 사용할때 (아무의미없음)

inline 속성의 대표적인 tag들

<span></span>

``<b></b>``----디자인상으로 굵은 bold

``<strong></strong>``-----b태그보다 사용빈도 높음.강조할때 굵음용 (리딩기가 읽을땐 악센트가 붙음)

``<i></i>`` -------글자 기울임꼴 이탤릭체

``<em></em>``-----강조의 다른태그 이탤릭체 하면서 굵음.(리딩기가 하이톤으로 읽음)

``<sup></sup>``---- 위로

``<sub></sub>----아래로

``<q></q>`` ------짧은 인용문 (문자열가르킴) (따옴표 안써도  저절로생김) 쿼터의약자 ex) 철수왈..등등

``<ins></ins>----- del 태그랑 같이움직임(ex 쇼핑몰할인가,정가 )인서트의약자

``<del></del>``-----딜리트의 약자

``<u></u>`` ----- 추가없이 밑줄되는것 

ins와 del은 무엇을 삭제하고 사용하는거고
  • span, strong,em 만 90% 사용

inline 추가입력사항

  <button type="button">버튼</button` -----type 이없어도 사용하지만 적는게 좋음
  <button type="submit">버튼</button>

<select> <option value="">서울</option> ----------셀렉트박스.디자인이 원래안됨(제이쿼리로 같이사용해야함)

    `` <option value="">경기</option>``

    `` <option value="">강원</option>``

    `` <option value="">경남</option>``

추가옵션 ★value="서울" 이라고 작성하지만 개발자가 하는거라 적지말기

inline 다른입력사항

<textarea> </textarea>

<textarea name="name" rows="8" cols="40"></textarea>

★여덟줄 공간보유에 한줄당 글자 40개 만들어달라내용 --보통 글자수 제어하지않고 사이즈로 준다. 이렇게 있다라고 생각만하기.

이미지링크

<img src="" alt="">

src: 소스의약자 alt: 이미지에대한설명(디테일하게, 최대한 구체적으로입력.리딩기가 읽어줘야해서)

★alt 필수요소: 내용이 없더라고 넣줘야함 폴더안에 이미지가 있으면 이미지 이름만(img1.jpg) 적으면되지만 현재 내 파일에 이미지 파일을 따로 만들었기때문에

★ 폴더안에 이미지 경로 찾을때

<../imgs/img1.jpg>*-------- 이게 상대경로(현재열고있는위치로부터 찾아감.폴더안에 이미지파일있고 안에 이미지 사진이 있다.)

<img src="../imgs/img1.jpg" alt="민들레사진">

★ 이미지 안에 이미지가 있을경우

<img src="img/img1.jpg " alt="민들레사진"> --------- (이미지 파일 안에 이미지사진이 있다.)

⚠️ **GitHub.com Fallback** ⚠️