일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- closure
- web
- Node.js
- component
- React.js
- javascript
- 키다리 개발 일지
- Element
- React calculator
- react
- map
- jsx
- 볶음밥
- Rendering
- ecma
- scope
- tag
- 시맨틱
- CSS
- vue.js
- includes
- 노드
- 키다리의 개발일지
- 회고록
- 키다리 개발자
- props
- wep
- ES6
- DoM
- html
- Today
- Total
목록Element (4)
키다리 개발자
CSS란? CSS는 Cascading Style Sheets의 약자입니다. CSS는 HTML 요소들이 각종 미디어에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어입니다. HTML4 부터는 이러한 모든 서식 설정을 HTML 문서로부터 따로 분리하는 것이 가능해졌습니다. 오늘날 대부분의 웹 브라우저들은 모두 CSS를 지원하고 있습니다. CSS를 사용하는 이유 HTML만으로 웹 페이지를 제작할 경우 HTML 요소의 세부 스타일을 일일이 따로 지정해 주어야만 합니다. 이 작업은 매우 많은 시간이 걸리며, 완성한 후에도 스타일의 변경 및 유지 보수가 매우 힘들어집니다. 이러한 문제점을 해소하기 위해 W3C(World Wide Web Consortium)에서 만든 스타일 시트 언어가 바로 CSS입니다...
태그의 구성에 대해 기록하겠습니다. ... 아래 사진은 html문서를 서로 연결시켜 이동하는 모습입니다. : 다른 페이지, 파일, 같은 페이지의 어느 위치, 이메일 주소나 그 외 다른 URL로 연결할 수 있는 하이퍼링크를 만든다. href="html 문서의 주소값" : html 문서로 이동시키는 속성이다. 한 줄 결론 따라서, 와 href속성은 이동시킬 HTML의 문서를 연결하고 이동시킨다. 이미지 태그는 단일 태그이다. HTML문서에 이미지를 삽입한 모습입니다. : HTML문서에 이미지를 삽입할 수 있으며 단일(홀) 태그이다. 따라서 본인 스스로 열고 닫는다. src="이미지 주소 값" : src 속성은 source의 약어이며, 이미지의 경로를 받는다. 한 줄 결론 와 src속성은 이동경로를 ..
실제 간단한 웹페이지를 만들어 HTML 기본 태그를 기록하였습니다. 실습한 웹페이지를 크롬(Chrome) 검사도구에서 텍스트상으로 설명하기 애매한 요소를 직접 확인하려고 열어보았습니다. 'F12' 또는 '오른쪽 클릭 후 검사'로 검사도구를 열어줍니다. 우측의 빨간 테두리 부분 안에서 태그 위로 마우스 커서를 이리저리 움직여 보면, 요소(Elements)들의 섹션(Section)을 좌측 화면(실제 화면)에서 직접 확인할 수 있습니다. 는 태그를 감싸준다(Wrap) HTML 코드 작성 후 크롬 검사도구 elements에서 위에 커서를 올려보면 구역이 지정이 되고, 웹 페이지 상 가 요소를 감싸고 있는 걸 확인할 수 있습니다. 즉, 는 태그들을 감싸는 역할을 합니다. 와 두 태그 모두 Text를 입력받는다 :..
HTML 요소(Element)의 구조 여는 태그(Opening tag): 이것은 요소의 이름과(이 경우 h1), 열고 닫는 꺽쇠 괄호로 구성됩니다. 요소가 시작(이 경우 단락의 시작 부분)부터 효과가 적용되기 시작합니다. 닫는 태그(Closing tag): 이것은 요소의 끝(이 경우 단락의 끝 부분)에 위치합니다. 닫는 태그를 적어주지 않으면 오류가 발생합니다. 내용(Content): 요소의 내용이며, 이 경우 단순한 텍스트이다. 요소(Element): 여는 태그, 닫는 태그, 내용을 통틀어 요소(element)라고한다.