생활코딩 WEBn
[생활코딩_WEBn] 최후의 문법 속성과 img
고구마광팬
2020. 9. 2. 15:37
---------------------------------------------------------
* 생활코딩 WEBn 정독하기 project *
최후의 문법 속성과 img
LINK : https://opentutorials.org/course/3084/18407
----------------------------------------------------------
속성 : 태그의 심화된 문법. -> 태그와 속성이면 HTML의 모든 문법 마스터.
1. 사진 넣는 법
1) img 태그 <img>
-
<h1>리그 오브 레전드란?</h1>
-
리그 오브 레전드는 5명의 강력한 챔피언으로 구성된 양 팀이 <strong>서로의 기지를 파괴하기 위해 치열한 사투를 벌이는 <u>전략 게임</u></strong>입니다. 140여 명의 챔피언 중 하나를 선택해 화려한 플레이를 펼치며 적을 처치하고 포탑을 파괴해 승리를 쟁취하세요.
-
-
<img>
-
-
<p style="margin-top:40px;">기지 파괴하기
-
<br>넥서스는 양 팀 기지의 심장부입니다. 적의 넥서스를 먼저 파괴하는 팀이 게임에서 승리합니다.</p>
-
<p>아군 넥서스<br>넥서스에서 미니언이 생성됩니다. 넥서스 뒤에 있는 소환사의 제단에서 체력과 마나를 빠르게 회복하고 상점을 이용할 수 있습니다.</p>
-
<p>적팀 넥서스<br>적팀 기지에는 아군과 동일한 넥서스가 있습니다. 적팀 넥서스를 파괴하면 게임에서 승리합니다.</p>
- 이미지 안나옴 : 태그의 이름만으로는 정보가 부족
2) 속성-src(source) : <img src="">
- unsplash.com : 공공재로 쓸 수 있는 이미지 많음.
- 다운로드 하여 현재 작업하는 소스가 있는 폴더에 넣기.
- 따옴표 안에 사진 파일 이름 넣기
-
<h1>리그 오브 레전드란?</h1>
-
리그 오브 레전드는 5명의 강력한 챔피언으로 구성된 양 팀이 <strong>서로의 기지를 파괴하기 위해 치열한 사투를 벌이는 <u>전략 게임</u></strong>입니다. 140여 명의 챔피언 중 하나를 선택해 화려한 플레이를 펼치며 적을 처치하고 포탑을 파괴해 승리를 쟁취하세요.
-
-
<img src="LOL.jpg">
-
-
<p style="margin-top:40px;">기지 파괴하기
-
<br>넥서스는 양 팀 기지의 심장부입니다. 적의 넥서스를 먼저 파괴하는 팀이 게임에서 승리합니다.</p>
-
<p>아군 넥서스<br>넥서스에서 미니언이 생성됩니다. 넥서스 뒤에 있는 소환사의 제단에서 체력과 마나를 빠르게 회복하고 상점을 이용할 수 있습니다.</p>
-
<p>적팀 넥서스<br>적팀 기지에는 아군과 동일한 넥서스가 있습니다. 적팀 넥서스를 파괴하면 게임에서 승리합니다.</p>
3) 크기 조절 : width="100%"
-
<img src="LOL.jpg" width="100%">
2. 속성(attribute)
1) 위치 상관없음.
2) 태그가 태그 이름만으로 부족할 때 사용.
* 관련된 게시물 *