YTCW

목록을 표현하는listtag는 대표적으로두 가지가 많이 쓰인다. 첫 번째는 ol tag두 번째는 ul tag ordered list ( ol )는 는순서가 중요할 때 사용된다. 순서가 중요할 때란가령 요리 순서가 될 수도 있고운동방법, 설명서, 실시간 검색어, 랭킹 등이것들은 순서가 중요하기 때문에ordered list를 사용해야 한다. 순서가 중요하지 않을 때는unordered list ( ul )을 사용한다. ul과 ol만 있다고 list가 만들어지지 않는다. ul과 ol 내부에는 list item ( li ) tag를 사용해야 한다. 여기서 반드시 지켜야 하는 문법이 있다. ul과 ol 태그 내부의 직계 자식은반드시 li 태그만 사용 가능하다.  //불가능 //가능  ol..

image를 첨부할 때 사용되는 tag이다. img tag를 사용할 때 반드시 두 가지 속성이 들어가야 하는데그중 하나는 source ( 경로 )다른 하나는 alternative text( 대안 )이다.이다. alt를 왜 꼭 적어줘야 하는 것일까? 경로가 file이라면 상관없을 수 있겠지만웹 주소를 통해 사용할 경우 추후에 해당 페이지가 삭제되거나image 변동이 있었을 때alt ( 대안 ) 이 없다면사용자는 엑스 박스로 보이게 되는데그에 따라 불편함을 느끼게 된다. 이 불편함 때문에 대안이 필요한 것이다. alt에 적힌 text가 image 대신 정보를 제공하게 된다. 또한 앞을 보지 못하는 분들은인터넷을 사용할 때screen reader를 사용하는데음성으로 읽어주는 기능이다. 이때 alt를 읽기 때문..

Anchor tag는현재 맥락에서 다른 맥락으로 이동할 때사용하는 tag이다. 하지만Anchor tag는이전 글에서 배웠던 tag들과조금 다른 tag이다. 앞서 설명했듯이 Anchor tag는이동하는 태그이기 때문에어디로 이동할지 알려줘야 하는데이때 href Attribute( 속성 )이 필요하다.href = hypertext reference ( 페이지 참조 값 ) 여기서 잠시 속성에 대해 간략히 설명하자면 내용 대략 이렇게 생겼다. Attribute 속성은 tag에 추가적인 정보를 주는 역할을 한다. Anchor tag에href Attribute를 적용하면 내용 이렇게 작성할 수 있다. href의 값으로는 여러 가지가 있지만대표적으로 첫 번째 - 주소이동 ( url ) 클릭시 주소이동//target=..

Emphasis : 강조의미를 강조할 때 사용하는 tag 배우기​크게 strong / em 두 개의 tag가 있다.​그렇다면 차이점이 무엇일까?​strong은 문자를 진하고 두껍게 만들어준다.​em은 문자를 진하고 두껍게 만들어주지는 않지만이탤릭체로 기울여서 표현된다.예) em을 사용했을 때의 모양​형태만 차이가 있을 뿐 의미적으로 강조되는 건 같기 때문에둘 중 쓰고 싶은 거 사용하면 된다.​이와 비슷한 tag로 b tag 와 i tag가 있는데 ​b tag 는 strong tag 와 같이문자를 진하고 두껍게 만들어주지만의미를 강조하지 않는다.​i tag도 마찬가지로em 과 같이 이탤릭체로 표현되지만의미를 강조하지 않는다.​실전 예제)위의 사진을 HTML 태그로 표현해 보자HTML 요소 HTML ..

HTML 문서는 대부분 엄청나게 많은 Tag 이루어져 있다.​그중에서 이번 글에서는 제목과 문단 Headings & paragraph 태그에 대해 배워보자.​Headings ( 제목 )​ 태그로는총 h1 tag부터 h6 tag까지 있다.일단 vscode로 파일을 열고 따라 해 보자 1. 폴더 이름은 마음대로 정하고2. index.html 파일을 만든다.왜 index로 만들까?웹 서버들이 index 파일을 제일 먼저 찾도록 설계되어 있다고 한다.제목제목제목제목제목제목 3. 위 코드를 복사해서 넣는다.​ 4. 마우스 우측 클릭Open with Live Server 클릭하면​이와 같이 나오게 된다.h1이 가장 크고 h2가 그다음으로 작고쭉쭉 내려오면 h6가 가장 작다.​paragraph ( 문단 ) 태그는 말..