오늘은 어제와 이어서 HTML을 더 알아보도록 하겠습니다.
1.html 문서의 기본구조
3). 문서를 표현하는 기본적인 태그들
3.그림(jpg,png,bmp,...)
-내용이 없는 태그
-속성을 통해서 이미지의 경로만 표현: src
-<img></img>, <img src="path" />
-path: local path , URL
URL: http://www.bloter.net/wp-content/uploads/2015/09/google-alphabet.png
ex)
*외부 링크로 가져오기
*리눅스에 wget으로 파일 다운받아 파일로 가져오기
-크기 조정 : width, height
ex)
위에 있는 예시보다 작아진걸 확인할수 있습니다.
4.표
- table tag
-기본 구조
<table>
<thead>
</thead>
<tbody>
<tr>
<th></th>#table의 제목 필드를 나타냅니다(글자가 볼드체로 나옵니다)
...
</tr>
<tr> #행 하나를 표현
<td></td>
...
</tr>
....
</tbody>
</table>
*경계선 속성 table border
ex)
!zip 패키지 설치와 압축 해제
#>yum install zip.i686
#>yum install unzip.i686
#>unzip <path>
bootstrap : css 파일 모음
*bootstap 다운 받기
#>wget https://github.com/twbs/bootstrap/releases/download/v3.3.2/bootstrap-3.3.2-dist.zip
*HTML 파일에 css파일 import 시키기
-head tag에 적는다
<head>
<link rel="stylesheet" href="bootstrap-3.3.2-dist/css/bootstarp.min.css">
</head>
ex)
5.링크
-웹의 주요 기능 중의 하나
-anchor, link
-anchor : <a herf=>link</a>
ex)
*글자에 링크걸기
*그림에 링크걸기
그림을 선택하면 daum 홈페이지로 넘어가는걸 확인 할 수 있습니다.
Javascript
-html 요소들을 제어할 수 있는 수단
-유일한 수단
<script> </script>안에 적으면 됩니다.
-기본구조
<!doctype html>
<html>
<head>
<script>
</script>
<script>
</script>
</head>
<body>
<script>
</script>
</body>
</html>
0. 문법
-문장의 끝에 ';'을 붙여줍니다.
1.변수
-변수의 선언
-변수에 대한 정의만 해주면됩니다.
-변수 이름 앞에 'var' 키워드를 붙여줍니다.
2.입/출력
1)출력
-document.write 창에 출력해줍니다
-alert 창이 떠서 출력합니다
-console.log 개발자 도구에서 보입니다
-confirm(); True or False를 입력받을 수 있습니다
ex)
*document.write
*alert
개발자 도구 console에서 직접 실행가능합니다
192.168.12.241/samplejs.html로 실행가능합니다
javascript:alert(apple) 실행가능합니다
*console.log
*confirm();
2)입력
-prompt
인자가 2개일 수도 있는데 그건 예시를 들 수 있는 인자입니다
ex)
3) 제어문: 조건문 ,반복문
-조건문 : if ,switch
*javascript는 Type이 없어서 1=="1"가 True로 나옵니다
Type 비교는 ===를 씁니다
ex)
*if
다음 수업에 이어서 Javascript를 다뤄보도록 하겠습니다
읽어주셔서 감사합니다.
'Security > Web' 카테고리의 다른 글
| [WEB SECURITY]6. PHP (0) | 2017.08.17 |
|---|---|
| [WEB SECURITY]5.Javascript 2 와 PHP (0) | 2017.08.16 |
| [WEB SECURITY]4.Javascript (0) | 2017.08.14 |
| [WEB SECURITY]2.WEB SERVER 구축과 HTML (0) | 2017.08.10 |
| [WEB SECURITY]1.CentOS 6 설치 및 기본 설정 (0) | 2017.08.09 |
