HTML7 HTML 텍스트 스타일링 태그 HTML에서는 텍스트의 스타일과 의미를 명확하게 전달하기 위해 다양한 태그를 제공합니다.웹 페이지를 구성할 때 텍스트의 가독성과 표현력을 높이는 텍스트 스타일링을 할 때 주로 사용하는 HTML 태그들을 알아보겠습니다. 1. strong 태그: 강한 강조strong 태그는 텍스트를 강하게 강조할 때 사용됩니다. 이 태그로 감싸진 텍스트는 대부분의 브라우저에서 굵게 표시되지만, 시맨틱적으로 중요한 내용을 강조한다는 의미를 가집니다. 예를 들어, 경고 메시지나 중요한 사실을 표현할 때 사용합니다.이 제품은 절대 먹어서는 안 됩니다.이 태그는 아래와 같이 표현됩니다. 더 굵게 보이는 텍스트를 보세요이 제품은 절대 먹어서는 안 됩니다." data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 이.. 2024. 8. 21. HTML의 a 태그 가이드 a 태그란?a 태그는 앵커(anchor) 태그라고도 불리며, 주로 하이퍼링크를 생성하는 데 사용됩니다.이 태그를 사용하면 사용자가 한 웹 페이지에서 다른 웹 페이지로, 또는 같은 페이지 내의 다른 위치로 쉽게 이동할 수 있습니다.기본 문법a 태그의 기본 문법은 다음과 같습니다:링크 텍스트 여기서 href 속성은 하이퍼링크의 목적지 URL을 지정하고, "링크 텍스트"는 사용자가 클릭할 수 있는 텍스트입니다.예제1. 외부 웹사이트로 링크:Example 사이트로 이동2. 같은 사이트 내의 다른 페이지로 링크:About 페이지로 이동 3. 같은 페이지 내의 다른 위치로 링크섹션 1섹션 1으로 이동 속성a 태그에는 href 외에도 여러 가지 유용한 속성이 있습니다:target: 링크를 열 때 브라우저의 동작을 지.. 2024. 8. 6. HTML <fieldset> HTML 태그 fieldsetHTML의 태그는 form 요소를 그룹화할 때 사용됩니다. 이 태그를 통해 논리적으로 관련된 폼 필드를 함께 묶어 시각적으로 구분할 수 있게 됩니다. 태그 안에는 보통 태그를 사용해 그룹의 제목을 설정합니다. 주요 특징을 다음과 같이 정리해보았습니다. 폼 그룹화:은 여러 폼 요소를 그룹으로 묶어줄 수 있습니다. 시각적으로 구분이 가능하게 해주며, 한 페이지 내에 폼이 길게 태그와의 조합: 태그는 의 첫 번째 자식 요소로 사용되어 그룹의 제목을 표시할 수 있습니다.에 정의된 텍스트는 경계선 위에 표시됩니다.접근성(Accessibility):과 태그는 스크린 리더가 폼 구조를 이해하는 데 도움을 주어 접근성을 향상시킵니다.스타일링:기본적으로 브라우저는 에 대해 테두리.. 2024. 7. 23. # Worklet Worklet Worklet이란 Worklet 인터페이스는 Web Workers의 경량 버전이며 개발자가 렌더링 파이프 라인의 하위 수준에 접근할 수 있도록 해준다. Worklet을 사용하면 JavaScript 및 WebAssembly 코드를 실행하여 고성능이 필요한 경우 그래픽 렌더링 또는 오디오 처리를 수행 할 수 있다. - MDN 기본적으로 Worker는 한 Thread에 하나가 생성이 가능하지만, Worklet은 한 Thread에 여러 개 생성이 가능합니다. 메인 Thread에서 만들 수 있습니다. 독립적인 GlobalScope와 Event loop를 가집니다. Worklet Type PaintWorklet LayoutWorklet AnimationWorklet AudioWorklet 그리고 Ty.. 2023. 7. 15. Front end 면접에서 자주 묻는 질문들 소개 프론트 엔드 개발은 웹 개발의 중요한 부분이며, 따라서 프론트 엔드 면접에서는 자주 묻는 질문들이 포함됩니다. 이러한 질문들은 면접관이 HTML, CSS, JavaScript와 같은 프론트 엔드 기술에 대한 지식과 이해력을 평가하는 데 도움이 됩니다. 이 블로그 포스트에서는 프론트 엔드 면접에서 자주 묻는 일부 일반적인 질문들을 살펴보겠습니다. 1. CSS에서 박스 모델이란 무엇인가요? 박스 모델은 웹 페이지에서 요소가 렌더링되는 방식을 설명하는 CSS의 기본 개념입니다. 이는 콘텐츠, 패딩, 테두리, 마진으로 구성됩니다. 콘텐츠 영역은 요소의 실제 콘텐츠가 표시되는 곳입니다. 패딩은 콘텐츠와 테두리 사이의 공간을 제공합니다. 테두리는 패딩과 콘텐츠를 둘러싸며, 마진은 요소와 페이지의 다른 요소 사.. 2023. 6. 27. Front end 면접에 대비하기 위한 팁과 가이드라인 소개 프론트 엔드 개발은 웹 개발의 중요한 부분이며, 이 분야에서 취업하기 위해서는 HTML, CSS 및 JavaScript에 대한 튼튼한 이해가 필요합니다. 프론트 엔드 면접에서 성공하기 위해서는 철저한 준비와 흔히 나타날 수 있는 주제와 질문에 익숙해져야 합니다. 이 블로그 포스트에서는 프론트 엔드 면접에 효과적으로 준비하기 위한 팁과 가이드라인을 제공하겠습니다. 1. 채용 요구사항 이해하기 면접 준비에 앞서, 지원하는 프론트 엔드 직무의 특정 채용 요구사항을 이해하는 것이 중요합니다. 채용 공고를 주의 깊게 읽고 필요한 기술과 기술들을 메모해두세요. 이를 통해 준비를 맞추고 역할과 관련된 가장 중요한 영역에 초점을 맞출 수 있습니다. 2. HTML 기본 개념 복습하기 HTML은 웹 페이지의 기반이 .. 2023. 6. 27. Front end 면접에서 예상되는 코딩 과제와 해결법 소개 프론트엔드 개발은 웹 개발의 중요한 부분이며, 프론트엔드 개발자로서 면접에 잘 준비하는 것이 중요합니다. 프론트엔드 면접에서 코딩 과제는 문제 해결 능력, 코딩 능력 및 프론트엔드 기술에 대한 이해력을 평가하는 중요한 요소입니다. 1. HTML 과제 HTML은 웹 페이지의 기초입니다. 프론트엔드 면접에서는 HTML 태그, 속성 및 의미 있는 마크업에 대한 지식을 평가하는 HTML 과제를 만날 수 있습니다. 일반적인 HTML 과제에는 다음과 같은 것들이 있습니다: vs : 차이점과 각각을 언제 사용해야 하는지 설명하십시오. HTML과 CSS를 사용하여 반응형 네비게이션 메뉴를 만드십시오. HTML5 속성을 사용하여 적절한 유효성 검사가 구현된 양식을 만드십시오. 2. CSS 과제 CSS는 웹 페이지의.. 2023. 6. 27. 이전 1 다음 반응형