3일차
!웹 해킹은 웹에 대해서 잘 알면 알수록 쉬워진다.
문서를 나타내는 태그(요소)
-제목,단락,링크,
Html 그림: img태그
-src:그림에 대한 경로/URL을 적어줘야한다
<img src="http://uhd.img.topstarnews.net/wys4/file_attach/2017/07/13/1499928397-25.jpg"/>
이런식으로 사용가능하다 img태그도 셀프태그라서 따로 설정할게 없다
-인라인 태그
-width:픽셀 단위 20,20px,20%
-height:픽셀 단위
url 말고 파일로도 설정이 가능하다 (리눅스에 파일 넣는법)
링크:a,link
-관련 있는 파일을 해당 페이지와 연결
-type: text/css
-href: path or url
-rel: 파일 정보
*디자인적인 요소 *
블록 태그:h,p,a
요소 하나가 한 블럭을 차지한다
한태그가 한블럭을 전부다 차지한다고 보면된다
인라인 태그:img,div
하나의 요소가 한블럭은 전부 차지하지 않는다
스타일 속성
-글로벌 속성
-배경색 지정
background-color:red
background-color:#RGB
background-image:url/path
<p style="background-color:red">
background-image:url/path
태그를 묶어서 특성을 표현할때 사용한다
예를 들어서 p태그로 여러개 있을때
<p id="">
<p class="">
각자 식별자를 지정하고 묶어서 스타일을 지정할수있다
id,class
-id: 요소를 식별하는 식별자를 지정
-유일한 식별자
-id를 사용하는 요소가 하나뿐인 경우
id는 앞에 #을 붙이면 되고
-class:요소를 식별하는 식별자
-그룹 식별자
-여러 요소를 그룹화 하는 경우
class는 .을 붙이면 된다
표:table
<table> <!-- 테이블의 시작 -->
<thead> </thead><!-- 테이블의 정보 -->
<tbody> <!-- 테이블의 내용-->
<tr>
<th> </th> <!-- 제목을 강조하는 칼럼-->
<td> </td> <!-- 한 컬럼을 나타낸다-->
</tr> <!-- 한행을 나타낸다-->
</table>
합병 colspan=숫자 <!-- 테이블의 끝 -->
bootstrapk < 디자인 서식을 가져다 쓰면 전문가 처럼 사용이 가능하다
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<head> 파일에 추가하고 쓰고싶은 특성을 찾아서 쓴다
'웹 해킹' 카테고리의 다른 글
| [Web해킹] 6일차 3x3 사진첩 만들기/mysql 기본 설정하기 (0) | 2017.11.21 |
|---|---|
| [Web해킹]5일차 php (0) | 2017.11.16 |
| [Web해킹]4일차 javascript (0) | 2017.11.16 |
| [Web해킹]3일차 javascript (0) | 2017.11.16 |
| [web해킹]2일차 HTML 기본 구조 (0) | 2017.11.15 |