전체 글
-
"i, em" 태그HTML 2024. 11. 17. 23:30
i는 italic의 i이고, em은 강조(emphasis)의 e를 의미합니다. i 태그와 em 태그는 위와 같이 글자를 '기울임'이라는 시각적인 효과에 있어서는 차이가 없습니다. 그래서 용도에 맞게 분리되어 사용되어야 합니다. 1. i 태그i 태그는 주로 외국어, 기술용어, 책제목 등 시각적인 효과를 위해 많이 사용되어집니다. 2. em 태그em 태그는 주로 글자의 중요한 특정 지점, 중요한 단어를 강조할 때 많이 사용되어집니다. 또한 웹 접근성이 좋은 태그입니다. 3. 결론시각적으로 동일한 효과를 가지고 있으므로, 웹 접근성이 좋은 em 태그를 쓰는 것이 더 권장됩니다. 이상입니다. 비슷하게 웹 접근성이 좋은 태그 알아보기https://free-weave.tistory.com/40 "b, str..
-
"b, strong" 태그HTML 2024. 11. 16. 09:44
글자를 강조하는 태그로, b 태그와 strong 태그가 있습니다. b 태그는 bold의 b이고, strong은 영단어 그대로의 의미를 가지고 있습니다. 두 태그 모두 시각적으로는 완전히 동일한 효과를 가지고 있습니다. 아래를 보실까요 위에는 b 태그를, 아래에는 strong 태그를 작성했습니다. 시각적으로 도저히 차이를 둘 수 없을 만큼 똑같은 효과를 가지고 있습니다. 바로 글자가 진해진다는 것이죠. 의미적으로는 차이가 있습니다. strong 태그는 이름 그대로, 중요한 강조점을 위해 사용되어지는 태그입니다. 반면, b 태그는 시각적으로 강조 표시되는 것 이외 특이점은 없습니다. 그리고 시각적 효과를 줄 때는 css를 쓰거나 style을 적용하는 것이 더 효과적입니다. 이것을 볼 때, 강조의 표현으로는 ..
-
"span" 태그HTML 2024. 11. 15. 00:05
span 은 범위나 간격을 의미하는 영단어 그대로의 의미로 사용되며,강조되지 않은 표현입니다강조 표현을 써주세요강조되지 않은 표현입니다 형식으로 작성할 수 있습니다. span 태그 안에 보라색을 적용한 화면입니다. 위와 같이 보통 다른 태그 안에 특별히 강조하기 위해서, 혹은 다른 디자인을 적용하기 위해서 span 태그를 사용합니다. span 태그 그 자체에 특별히 의미가 부여되어 있지 않기 때문에, 달리 사용할 태그가 있다면 그 태그를 우선으로 사용하는 것이 권장됩니다. 이상입니다.
-
"p" 태그HTML 2024. 11. 14. 18:08
글자를 작성할 때 기본적으로 p 태그를 사용하게 됩니다. p 태그는 문단(paragraph)의 약자로, 문단입니다. 글자를 작성할 때 쓸 수 있어용 형태로 작성됩니다. 위와 같이 사용할 수 있습니다. 두 번 연속으로 쓰면, 위와 같이 표시됩니다. p 태그는 기본적으로 문단 형태기 때문에, 새로운 p 태그를 시작한다는 것은, 기존 단락이 끝나고 새로운 단락이 되었다는 의미입니다. 그래서 글자에 약간의 들여쓰기를 포함하고 있고, 새 단락이 시작할 때 기존 단락과의 끝을 고한다는 의미로 Enter를 친 것 같은 효과가 있습니다. 왜, Word에서도 그런 거 있잖아요. 새 단락으로 Enter 쳐서 내려가면, 글자 줄 간격이 달라지잖아요. 그런 느낌입니다. 한 줄이라 잘 모르겠다고요? 두 줄을 써 보았습니다. 확..
-
주석 처리HTML 2024. 11. 13. 18:40
코딩을 하다 보면 필연적으로, 주석 처리를 하고 싶은 순간을 맞이하게 됩니다.연산이 잘못 되어 결과가 안 나오는데, 그 전까지 작업하던 코드들이 아까울 때 임시로 주석 처리 해두고, 더 좋은 아이디어에 대해서 생각할 때도 있습니다. 그럴 때, HTML에서는 태그를 사용합니다. 이 코드에서 윗 줄이나 아랫 줄 혹은 전부 다 등 아무 곳이나 원하는 곳에 주석을 설정해둘 수 있습니다. 여기까지 모든 HTML 코드에 통용되는 내용이었고요. brackets 에서는편집 메뉴에서 한 번에 주석 처리 할 수도 있습니다.또한, 단축키를 외워두면 더 편하게 주석 처리 할 수 있습니다. 이상입니다. Eclipse의 주석 처리 알아보기https://free-weave.tistory.com/14 주석 처리코드를 ..
-
[brackets] 코드 자동 완성 단축키IT 일반 2024. 11. 12. 22:24
"brackets"라는 에디터에도코드 자동 완성 단축키가 있습니다. 코드 자동 완성 이란여기 녹색 부분을 뜻합니다.검색하려고 할 때 추천검색어랍시고 검색창 하단에 표시되는 것과 같은 원리의 동작이라고 할 수 있겠네요. 아무튼 이런 코드 자동 완성 기능이 있으면 편리한데,코드 작성하다 보면 작성하던 거 까먹고 다른 거 클릭했다가 다시 돌아오고 싶을 때도 있어요.그럴 때 이 코드 자동 완성 기능 단축키를 알아두면 언제든지 바로 코드 자동 완성 목록을 꺼낼 수 있습니다. 단축키는[Ctrl] + [Space Bar] 입니다. 번거롭지만, 편집 메뉴에서도 해당 기능을 사용할 수 있습니다. 그 외 여러가지 기능도 있어보이니 한번씩 사용해보는 것도 좋겠네요.
-
"ul, ol, dl" 태그HTML 2024. 11. 11. 04:16
목록(리스트 list) 형으로 데이터(data)를 넣게 될 때,주로 ul, ol, dl 태그를 쓰게 됩니다. 먼저 ul 태그는 un ordered list 이런 식으로 쓰게 되는데,순서가 중요하지 않은 항목을 나열할 때 사용됩니다. 기본적으로 검은색으로 칠해진 동그라미(●) 가 붙어서 나오게 되며, 일반적으로 순서가 없는 항목을 나타낼 때 사용됩니다. 다음, ol 태그입니다.ol 태그는 ordered list 이런식으로 쓰게 됩니다. 위와 같이 기본적으로 숫자형태로 표시됩니다. 다음, dl 태그입니다.dl태그는 ul ol 태그와는 좀 다른 속성을 가지는데요.일단 dl은 definition list, 즉 정의(定義)하다의 정의 항목이라는 뜻입니다.일반적으로 ol ul 태그는 자식 태그로 list의..
-
"h1~h6" 제목 태그HTML 2024. 11. 10. 18:39
제목1 와 같이 h1태그는 제목을 표시하는 태그입니다. h는 heading의 약자이며, 제목을 의미합니다. h1 태그는 h1부터 h6까지 총 6단계의 제목으로 구성되어 있습니다. 각 숫자는 제목의 중요성을 의미합니다. 1에 가까울수록 더 중요하고, 6에 가까울수록 덜 중요합니다. 더 중요할수록 글자가 크고 진함도 선명해집니다. 웹페이지로 볼까요. 위에 상기한 것과 같이, 각 제목 태그에 따라 글자의 선명도와 크기가 다름을 알 수 있습니다. 이러한 h1 ~ h6 태그는 상황에 맞게 잘 조절해서 사용하면 좋습니다. 먼저 h1태그는 해당 페이지에서 가장 중요한 주제를 담은 제목을 표현할 때 사용하면 좋은 태그라고 할 수 있겠습니다. 그런 의미에서도, 되도록 해당 페이지 별로 하나의 태그만을 사용하는 것이 권장..