forDevLife

+ 이전 시간 내용 추가 맨 위에서 width/height을 통해 맨 가운데 부분, 즉 text 입력 시 글씨가 시작되는 부분의 범위를 정해준다. background는 border까지 색이 입혀지게 된다. output에 녹색으로 표시되는 부분이 현재 Layout에 해당하는 범위이다.(개발자도구에서 해당 Layout에 마우스를 올려 볼 수 있다.) 그 다음은 padding이다. contents를 둘러싸는 부분으로, 4개 입력하면 위에서부터 시계방향으로 Padding을 설정할 수 있다. 다음은 border이다. padding을 둘러싸고 있으며, 선 굵기, 스타일 및 색을 선택할 수 있다. border-width, border-style, border-color 등으로 하나 하나 지정도 가능하다. border..

https://developer.mozilla.org/en-US/docs/Web/HTML/Element 참고 https://validator.w3.org/ -> 내가 작성한 html이 유효한지 검토해줌 말도 안되는 태그를 써도 일단 출력은 된다. 브라우저에서는 일단 보여준다. 웹 페이지를 하나하나 구분해서 볼 수 있는 능력을 기르자. React 배울 때, 최고 작은 단위로 쪼개서 구현하는게 중요하기 때문에 나중을 위해서. 박스 모델로 태그를 구분한다. html tag는 크게 두 개로 나눌 수 있다. Box : 보이지 않음, 섹셔닝 역할 / Item : 사용자에게 보여지는 부분 article : 재사용 div : 흔하게 쓰임. 가볍게 묶는 역할 html에서 제공하는 section tag를 이용해서 구분한다..

1. html 1. htmltagwrap 확장 프로그램을 통해 원하는 태그로 문자에 wrap을 할 수 있다. 원하는 문자를 블록한 후, option + w를 누르면 설정 가능하다. 2. form 태그 내에서 여러가지 input을 통해 각각 다른 전송이 가능하다. - 첫 번째 input은 name = "q"를 가지는데, 이를 통해 구글 검색 시 /search?q="검색 내용" 쿼리로 들어가게 된다. - placeholder는 아무것도 입력되지 않았을 경우 기본으로 입력되어 있는 내용이다. - aria-label은 텍스트 레이블이 화면에 보이지 않을 때 참조하는 label이라고 하는데 의미를 잘 모르겠다. - class에 rounded-pill이 들어있다. 이 class는 부트스트랩 링크 안에 있으며, in..

자바스크립트를 사용하여 다음의 일을 할 수 있다. 1. HTML의 '내용'을 변경할 수 있다. 2. HTML의 '속성'을 변경할 수 있다. 예를 들어 버튼을 클릭하여 특정 태그의 src 속성을 변경할 수 있다. 3. HTML의 '스타일'을 변경할 수 있다. html input tag 내의 'id'는 javascript에서 getElementById에서 사용된다. form tag에서 input 태그 내의 name=" " 은 넘기기 위해 사용된다. value는 사용자가 입력된 값이 여기로 들어가는데, 생략해도 무관한 것으로 보인다. 기존에는 웹브라우저마다 다른 코드를 짜야해서 자바스크립트를 매우 어려워 했다. 브라우저마다 다르게 해야 하므로. jQuery 메서드가 이를 해결해준다. 브라우저에 따라 동작하는 ..

1. 블록과 인라인 HTML의 모든 요소는 해당 요소가 웹 브라우저에 어떻게 보이는가를 결정짓는 display 속성을 가진다. 대부분 HTML요소는 이러한 display 속성값으로 다음 두 가지 중 하나를 가지게 된다 -> 블록, 인라인 1) 블록 : 언제나 새로운 라인에서 시작하며, 해당 라인의 모든 너비를 차지한다. * , , , , , 요소는 모두 속성이 블록이다. 요소 다른 HTML 요소를 하나로 묶는 데 자주 사용되는 대표적인 블록 요소이다. 주로 여러 요소들의 스타일을 한 번에 적용하기 위해 사용된다. 2) 인라인 : 새로운 라인에서 시작하지 않는다. 또한 요소의 너비도 해당 라인 전체가 아닌 해당 HTML 요소의 내용(Content) 만큼만 차지 * , , 요소 등이 있다. : 텍스트의 특정..

: preformatted text : 해당 태그 내에서 작성된 텍스트의 모든 띄어쓰기 & 줄나누기는 웹 브라우저에 그대로 표현 : horizontal rule : 수평 가로 구분선 : html 주석 부분(중첩 불가) 을 통해 css 스타일을 HTML 요소에 직접 설정 가능하다. 하지만 이러한 방법은 오직 단 하나의 HTML 요소에만 스타일을 적용할 수 있다. style 속성 값에 사용되는 CSS 속성과 속성값들은 세미콜론(;)을 이용하여 구분한다. CSS를 하나만 사용할 때나, 여러 개의 CSS 속성 중 맨 마지막 속성은 세미콜론 생략할 수 있다. + CSS를 통해 아래와 같이 내의 을 통해 일괄 설정도 가능하다. 배경을 이미지로 사용 가능하다. 배경을 이미지로 사용하면 웹페이지 로딩 시간이 증가하게 ..