# html
[04.14] HTML/CSS 활용
목차 레이아웃 Flebxbox [Pair] 계산기 목업 만들기 회고 레이아웃 목업이란? : 실물 크기의 모형 웹 또는 앱을 제품이라고 할때, 목업은 실제 제품이 작동하는 모습과 동일하게 HTML 문서를 작성함 레이아웃 리셋 : HTML문서는 기본적인 스타일
[html] <select> 태그의 초기 옵션 선택 값 정의할 때 유의할 점
선택 필터를 위한 Custom Select 컴포넌트를 개발하면서 아래와 같은 Warning error 를 마주하였다.export type optionType = { label: string; value: string | number;};interface SelectPr
(2023/06/09) 공부 일지!
defer=> 스크립트를 바디의 해석이 끝난 이후에 실행되도록 한다hidden=> 탭했을 때 선택되는 박스 영역이 보이지 않을 수 있다그라데이션 색깔 조합으로 배경 만들기멀티로 배경을 지정할 때는 뒤에 배치할 배경의 코드를 밑에 위치한다자바스크립트를 이용한 애니메이션에
[html5] #figure, figcaption 태그
figure 태그figure 태그는 문서의 내용과 상관은 있지만figure 태그가 제거 되거나 다른 곳으로 이동해도 문서의 내용에 영향을 주지 않아야 한다.태그의 사용은 기본적으로 figure 태그 안에 img태그를 넣어 사용한다.figcaption 태그figcapti
#4.6~5.0
(username) 이 인자로 오는 이유는, 위의 onLoginSubmit의 username을 h1의 내용에 넣어야 하기 때문에 데이터를 username으로 받기 때문이다. 같은 로직으로 하단의 if문에서는 username을 savedUsername라는 변수로 받기 때
#4.3~4.5
JS는 함수를 실행시키는 동시에 그 함수에 첫번째 인자에 object를 넣어준다. object에는 방금 일어난 event에 대한 여러정보가 담겨있다.addEventListner 안에 있는 함수는 직접 실행하지 않는다. 브라우저가 해준다. 브라우저는 이벤트에 대한 정보도
[04.12] HTML 기초
웹 개발 이해HTML 기초HTML 심화 학습자기 소개 페이지 만들기회고HTML : 구조 (Structure)CSS : 스타일 (Presentation)JS : 상호작용 (Interaction: 마이크로소프트에서 개발한 전 세계에서 가장 대중적인 코드 에디터 프로그램,
리액트 React 커스텀 select
내가 올린 codesandbox 코드!!! 너무 바빠서 설명은 나중에 추가하도록 하겠습니다..ㅠㅠ https://codesandbox.io/s/custom-radius-select-tag-6jh9qd?file=
HTML_CSS Semantic tag, display, margin, padding, box (230609)
semantic, display, margin, padding
opgg 클론
============================================================================================================================
strong 태그, em 태그 언제 사용할까?
strong태그는 글에서 중요한 내용, 경고에 사용합니다. 페이지나 섹션의 중요한 문장, 문장에서 중요한 단어로 쓰일 수 있습니다. em태그는 텍스트를 강조할 때 사용합니다.문장에서 단어 하나 또는 몇 개로 강조할 수 있습니다.WHATWG에서strong태그(https&
HTML | BLOCK와 INLINE
BLOCK요소와 INLINE요소 HTML block 요소 address, article, aside, audio, blockquote, canvas, dd, div, dl, fieldset, figcaption, figure, footer, form, h1, h2
HTML의 태그
HTML에는 다양한 종류의 태그가 있습니다. 이 태그들은 웹 페이지의 구조, 콘텐츠, 스타일, 동작 등을 정의하는 데 사용됩니다. 제목(Heading) 태그 , , , , , 제목 요소로 사용되며, 숫자가 작을수록 중요도가 높아집니다. 😁출력 문단(Par
position: sticky
스크롤을 내리다가 특정 element가 viewport를 벗어나는 순간 상단 고정되는 UI를 구현하고 싶어서 방법을 찾아봤다.position: sticky;를 이용하면 간단하게 구현할 수 있다.position: sticky;는 이 속성이 적용된 element의 pare