ko en fi en ko ko ko ko en en en en ko ko en ko en ru ko en ru ko ko ru fr ko en ko ko en ko ko en ko ko en ko ko en ko ko en ko ko en en ko en ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko en ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko pl ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko en ko ko ko en ko ko ko ko ko ko ko en ko ko ko fi en en
[길벗 학습단] 3장 실무에서 자주 사용하는 HTML 필수 태그 (1) – ennuism
2022년 2월 3주(14일~20일) 매일 영어 3줄 일기
2022.02.14 Recently, I kind of want buy a iPad. iPad is too expensive to buy readily, but I can buy it cheaper with student discounts. Nevertheless, I’m not sure if I can use it well, so I can’t make up my mind whether to buy or not. Maybe, it should be betther to buy Apple […]
2022년 2월 2주(7일~13일) 매일 영어 3줄 일기
요즘 네이버 블로그에서 영어 일기 챌린지 중이라 힘겹게 ㅎㅎ 올리고 있는데. 여기에도 갈무리해서 올린다. 2022.02.07 Today, I took class about American economy by reading economic articles.It was about U.S. bonds and I was interested in it because I didn’t know much about it.I should buy ETF related to U.S. bonds out of interest. 2022.02.08 I […]
This is Vocabulary 고급편 2회독 성공!
작년 6월 경 트위터에서 “This is Vocabulary 고급편”라는 책이 단어 공부에 좋다며 엄청 알티타길래 충동적으로 구입했더랬다. 그대로 “집에 있는 깨끗한 영어책” 리스트에 올라갈 뻔… 했으나! 다행히 트친 분께서 스터디에 끼워주셔서 6개월이 지난 현재 2회독 하는 것에 성공!! 스터디는 퀴즐렛이라고 하는 어플(홈페이지도 있음)을 이용했는데, 매 주 스터디원들이 돌아가면서 단어와 뜻을 등록한 후 어플 기능을 이용해 암기 […]
오늘 새벽 굉장히 반가운 목소릴 들었다. 사실상 은퇴 상태였던 아야야가 거의 10년 만에 라디오에 출현했더라고. 유튜브에 올라왔길래 호다닥 들었지. ​노래도 좋고 잘하던 친구였는데 결혼한 이후 사실상 은퇴 상태여서 너무 아쉽고 슬펐다. 당시에는 아이돌끼리 순애보 연애를 한 후 결혼한다며 나름 화제였는데, 정작 결혼 이후 아야야는 (사실상) 은퇴, 놈남편은 여전히 음악 하면서 살고 있고… 보면서 씁쓸. 본인이 […]
원래 네이버 블로그에 썼던 글인데. 여기에도 올려봄. 이렇게까지 내 얘기를 온라인에 한 건 무지 오랜만이네. 최근에 당근이 ‘당신의 근황’의 줄임말이란 걸 알았다. 대충 ‘일기’의 대체어로 사용되는 듯 하다. 나도 이제 당근이라고 해야지. 이번 주도 바쁘게 지내고 있고 기억에남는 특별한 일이 없음. 음… 직장에서도 큰 일이 없고. 정말 이렇게 순탄하게 살아도 되는 것인가. 정혈기간이 다가옴에도 딱히 […]
[길벗 학습단] 8장, 9장 자바스크립트 (1)
[길벗 학습단] 7장 효과적인 레이아웃을 위한 CSS 속성
[길벗 학습단] 6장 CSS 필수 속성 다루기 (4)
6. 전환 효과 속성 적용하기 css 한 요소에 적용된 속성값을 다른 속성값으로 바뀌게 하는 것 transition-property: 속성값;transition-duration: 지속시간;transition-delay: 지연시간;transition-timing-function: 속성값; /* 전환되는 시간? */ 7. 웹 폰트와 아이콘 폰트 사용하기 1. 구글 폰트 적용하기 구글 폰트 사이트에서 원하는 폰트를 고른 후 important로 시작하는 코드를 css파일 최상단에 넣는다. 그러면 font-family 속성으로 해당 폰트를 넣을 수 있다. […]
[길벗 학습단] 6장 CSS 필수 속성 다루기 (3)
5. 위치 속성으로 HTML 요소 배치하기 1. position html 요소를 좌표값에 따라 배치할 때 static, relative 등 속성값이 있다. static은 기본 흐름에 따라 배치하는 것 1. relative 기준점이 해당 요소의 왼쪽 위 모서리. left: 10px; /* 왼쪽 위 모서리로 부터 왼쪽으로 100px 떨어진 것 */top: 10px; /* 왼쪽 위 모서리로부터 100px 아래 */ 2. absolute […]
[길벗 학습단] 6장 CSS 필수 속성 다루기 (2)
3. 박스 모델을 구성하는 속성 다루기 html 문서의 각각의 요소는 사각형 박스로 둘러싸여있다. 즉 하나의 박스이다. 그 박스를 css로 적절히 배치해 레이아웃을 잡는다 1. margin(외부여백), padding(내부여백) margin 은 인접한 marign값이 좀 더 큰 값으로 통일되는 겹침 현상이 있다. 2. border 테두리. 3. content width, height는 padding, border 사이즈까지 더한 값으로 나타난다. 즉 width를 100px 로 […]
[길벗 학습단] 3장 실무에서 자주 사용하는 HTML 필수 태그 (1)
2022-01-07 / by pinika / 0 Comments
3장은 HTML에서 자주 사용되는 태그에 대해 설명하고 있고 대략적인 목차는 다음과 같다.
웹 페이지 구조를 설계하는 시맨틱 태그
태그 종류에 상관없이 사용하는 글로벌 속성
제목을 쓸 때 사용하는 태그이다. h1부터 h6까지 존재. 검색엔진에 잘 걸릴 수 있게 h1부터 적절하게 사용하자.
2. p, br 태그
p는 문단 태그이다. 이 안에 텍스트를 넣는다.
br는 문단에서 줄을 바꿀 때 사용한다.
이렇게 쓰면 된다.  줄바꿈이 된다.
3. blockquote, q 태그
blockquote은 문단 단위의 텍스트 인용할 때 사용한다.
cite 속성을 사용하면 출처 경고를 쓸 수 있다.
그리고 block 태그 아래에 p 태그를 써야 한다.
q 태그는 텍스트 단위의 짧은 인용문을 작성할 때 사용. 마찬가지로 cite 속성 사용 가능.
이것은 인용구 예시입니다.       짧은 인용문
4. ins, del 태그
ins는 아랫줄, del은 취소줄이다.
5. sub, sup 태그
sub은 아래 첨자, sup은 위 첨자이다.
관련있는 요소끼리 그룹으로 묶으면 레이아웃 구성이 쉬워짐.
1. div 태그, span 태그
div는 block 요소, span은 inline 요소
class 속성을 추가하면 CSS를 사용할 때 식별자로 사용 가능 (5장)
span은 텍스트 중간에 넣는다.
제목    콘텐츠입니다. 이것은  span 태그 확인 용입니다.
1. ul, ol, dl, li
ul은 순서 없는 목록, ol은 순서 있는 목록이다. 목록 내용은 li 태그로 구성
dl은 정의형 목록이다. 목록 내용은 dt, dd 태그로 구성
귤   과자         1번   2번         용어 제목   용어 설명
4. 링크와 이미지 넣기
a 태그는 대상 경로를 의미하는 href 속성을 필수로 사용. 그 외에 target, title 같은 속성이 있다.
href : 대상 경로 (URL, 내부 문서의 id 속성 값)
target : 대상이 연결되는 방식. 생략 가능.
title : 링크를 설명할 수 있는 텍스트 작성.
HTML 내에서 그림과 같은 이미지 삽입시 사용. src, alt 속성
src : 이미지의 경로
./ 현재 폴더 (생략 가능하나 브라우저마다 다르니까 생략하지 않는 것이 좋다.)
alt : 이미지에 대한 설명(텍스트)
strong : 글자 굵게
em : 글자 기울어지게
Categories: HTML/CSS/JavascriptTags: css, front-end, html, javascript, 길벗출판사, 학습단
답글 남기기 응답 취소
이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다
다음 번 댓글 작성을 위해 이 브라우저에 이름, 이메일, 그리고 웹사이트를 저장합니다.
Previous: [길벗 학습단] HTML+CSS+자바스크립트 1~2장
Next: [길벗 학습단] 3장 실무에서 자주 사용하는 HTML 필수 태그 (2)
WP Notes theme by VitaThemes
(c) 2021. pinika. All rights reserved.