블로그 이미지
인생의무한루프
인생에 무한루프.....

calendar

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

Notice

Tag

Recent Post

Archive

Recent Comment

Recent Trackback

'전체 카테고리'에 해당되는 글 57

  1. 2010.09.09 스타일 시트( CSS )
  2. 2010.09.06 Html 기본 태그
  3. 2010.09.06 Html 기본 문법
  4. 2010.08.27 간단한 Unix 명령 및 Putty 사용 팁.
  5. 2010.04.11 SQLite 와 C++ 연동방법
2010. 9. 9. 17:10 Web/Etc..

스타일 시트( CSS )



Web 공부를 하면서 가장 고민했던게 이 스타일 속성이였다..
당췌 정형화 되어 있는거 같지도 않고 어디에 선언되어 있는지도 찾기도 힘들었으며
속성중에 무엇이 있는지 알려주는 사람도...물어봐도 제대로 대답해 주는 사람도 없으니
그냥 통밥을 굴리는 수 밖에...

스타일은 화면을 구성할시 화면의 속성에 사용되는 경우가 많은것 같다.
css 파일을 통해 모듈화를 시켜 간단히 여러곳에서 가져다 쓸수 있으며 태그에 스타일을
입힐수도 있고 class 를 통해 예외적으로 쓸수도 지정해서 쓸수도 있는것 같다.
그밖에 개별적으로 style="~~~" 형태로도 사용 가능하다.

스타일 시트의 기본적 형태는
<속성이름>:<속성값>; ==> font-size:10px; 형태로 적는다.
사용방법이 3가지 정도 되는데..
한가지는 태그에 직접 적용하는것, class 형태나 id로 콕찝어서 사용하는 방법등이다.
td {~~~~} ==> 태그에 직접쓰는 방법으로 td 태그에 들어가면 모두 적용된다.
.<클래스 이름>{~~~~} ==> 클래스쪽에 선언된 이름을 적음으로써 사용한다.

#<아이디 이름>{~~~~} ==> 아이디쪽에 선언된 이름을 적음으로써 사용한다.
클래스와 아이디 모두 적용범위를 한정지어서 사용하는데 다른점은 아이디 이름은
Script 에서도 사용하므로 좀더 직관적?이래야 될까?하여간 걍 클래스 이름으로 사용하는게
더 편할수도 있다. 

     <style>

     td { text-align:right; } 

     .csstest{ text-align:center;font-size:3; }

     </style>

     <table>

          <tr>

               <td>태그에 입힌것</td>

               <td class="csstest">태그를 제외하고 클래스를 통한 예외</td>

          </tr>

     </table>

  
*css 파일을 통한 공통 스타일시트 적용시 최상위에 css 파일만 선언해 줘도 된다. 
     <link rel="stylesheet" type="text/css" href="/path/css/teststyle.css"

<속성 정리>

1. font-family:굴림; = 글꼴 변경(굴림)
2. font-size:10px; = 글꼴 사이즈(px, pt)
3. font-weight:bold; = 글꼴모양(두껍게)
4. padding-top:10px; = border를 기준으로 안쪽여백(left, right, top, bottom)
5. margine:10px 20px 30px 40px; : border를 기준으로 바깥쪽 여백
                                            (시계방향 순으로 사이즈 나타냄)
6. border-style:double; = 테두리모양(none, solid등 그외 width, color등이 있다)
7. line-height:100%; = 줄간격 높이(normal, 실수, %)
8. letter-spacing:-3px; = 글자 간격(notmal, 길이)
9. word-spacing:10px; = 단어 간격(notmal, 길이)
10. background-repeat:no-repeat; = 배경 반복(repeat, no-repeat, repeat-x,y, 
                                           그외 속성으로 xolor, image, position등이 있다)
11. a:link : 기본 링크(처음 방문할때)
12. a:visited : 방문 링크(방문한다음)
13. a:active : 활성 링크(클릭할때)
14. a:hover : 오버 링크(마우스 오버)
15. cusor:default : 마우스 커서 모양 정의(default, help, pointer, wait, text)
16. position:absolute; : 레이어 위치
17. z-index:1; : 레이어 순서
18. overflow:hidden; : 레이어안의 데이터가 넘칠때(auto, visible, hidden, scroll)
19. visibility:hidden; : 레이어영역을 화면에서만 보이게/숨기게(visible, hidden)
20. display:none; : 레이어 영역자체를 없애기/남기기(none, block, iline)

posted by 인생의무한루프
2010. 9. 6. 17:00 Web/Etc..

Html 기본 태그


[글자 태그]
      
    <h1>글자크게</h1> - <h5>글자작게</h5> - 글자 크기...숫자가 클수록 글자가 크다.
    <b>굵게</b> - 글자 굵게
    <i>이탤릭체</i> - 글자 이탤릭체로( 기울어짐 )    
    <u>밑줄</u> - 글자에 밑줄
    <p>, <br> - 개행
    <&nbsp> - 공백 1칸( 띄워기 )
    <pre> ~~~ </pre> - 사이의 글은 <p>등 없이고 띄어쓰기 개행이 쓴데로 그대로 적용.
    <, >  &lt; , &gt; - 태그가 아닌 문자로서 <, >를 쓸때 쓰는 문자. 
    <marquee></marquee> - 문자열을 위, 아래, 오른쪽, 왼쪽등으로 이동 시킴
    <font size="2(크기)" color="red(색)" face="굴림(글자체)"> 표시할 글 </font>
    
<span style="font-size: 8pt;color:008000;"> 표시할 글2 </span>
                                  
- 폰트, 색, 크기등을 지정하여 준다.




[이미지 태그]

   <img src="img/daum_main.jpg" alt="다음"> -
마우스오버시 다음이라고 뜬다.
    <img src="img.daum_main.jpg" border="5"> - 테두리가 설정 된다.
    <img src="img/daum_main.jpg" align="top(middle/bottom)"> - 정렬을 시킨다.
    <img src="img/daum_main.jpg" width=300(100%) height=200(50%)"> - 크기지정.



[링크 태그]
   
   <a href="
http://www.daum.net"> 다음 </a> - 기본적인 링크 연결
    <a href="~~~"> <img src="~~" > </a> - 이미지를 링크에 연결하는 식으로 응용한다.
    <a href="~~~" target="_blank(_self/_top) title="태그"> 테스트 </a> 
                            - 새창(현재창/현재창 없애고새창)에서 링크를 열고 링크설명을 할수 있다.
 


[테이블 태그]

   <table id="test_view" width="100%" border=0 cellpadding=0 cellspacing=0>
          <tr width="100%" height=50>
                 <td style="padding-top:10px;"> 테스트 </td>
          </tr>
   </table>


   <table 옵션>
          width - 넓이
          height - 높이
          border - 선 굵기
          bordercolor - 선 색상
          align - 정렬 위치(left, center, right)
          cellpadding - 셀 여백
          cellspacing - 표 테두리 간격

   <tr, td 옵션>
          width - 넓이
          height - 높이
          align - 수평 정렬(left, center, right)
          valign - 수직 정렬(top, middle, bottom)
          style - 스타일 태크
          colspan - 가로 셀합치기
          rowspan - 세로 셀합치기


posted by 인생의무한루프
2010. 9. 6. 16:24 Web/Etc..

Html 기본 문법


[기본문법]

<html>
      <head>
      <title> 제목 <title>
      <meta> 여러 정보값 입력 </meta>
            <style type="text/css">
                  스타일시트 정의
            </style>
            <script type="text/javascript">

                  자바 스크립트 선언
            </script>
      </head>
      <body>
              화면 구성
      </body>
</html>



[Meta 예제]
      <meta http-equiv="content-type" content="text/html; charset=euc-kr"> - 언어형식 정의.
      <meta http-equiv="refresh" content="10; url=http://naver.coml"> - 오픈시 url로 강제이동.
      <meta name="keywords" content="VC, Web, Java"> - 검색엔진의 키워드에 page를 등록.
      <meta name="descript-xion" content="Programing 관련"> - 검색엔진에 page 설명 요약.



[Style 예제]
      -선언-
      <style type="text/css">
      TestDiv { border-right:1px #9FB0CC solid;padding-bottom:2px; }
      TestTable { float:left;width:50px; solid;padding-top:2px;text-align:center; }
      TestTD { width:100%;height:0px;font-size:9pt;font-family:굴림체; }
      </style>
      
      -사용-
       <div id="Div">
               <table id="TestTable"></table>
       </div>
     *css 파일을 통한 공통 스타일시트 적용시 최상위에 css 파일만 선언해 줘도 된다. 
     <link rel="stylesheet" type="text/css" href="/path/css/teststyle.css">



[JavaScript 예제]
       -선언-
       <script type="text/javascript">
        function fnTest()
        {
               return 100;
        }
       -사용-
       <input type="checkbox" id="testCheck" checked value="T" onclick="fnTest()"> ~~~
     *js 파일을 통한 공통 스크립트를 적용시 최상위에 js 파일만 선언해 줘도 된다. 
     <script type="text/javascript" src="/path/scripts/testscripts.js"></script>



[Body 예제]
      기본태그들을 사용하여 화면을 구성하면 된다.
posted by 인생의무한루프
2010. 8. 27. 14:07 Web/Etc..

간단한 Unix 명령 및 Putty 사용 팁.

ls -l       :     권한등 옵션을 보여줌
ls -al     :     숨은파일등 모든파일과 옵션을 보여줌

pwd       :     현재 위치한 디렉토리를 알려줌

cp         :     파일복사    >>    cp [복사할 파일명] [복사되어 생성될 파일명]
mv         :     파일이동 또는 파일이름 변경시 사용한다.    >>    mv [옵션] [원본파일] [목적파일]
rm         :     파일 삭제    >>    rm [옵션] [파일]
chown    :     새로운소유자로 파일(디렉토리)  권한변경
chgrp     :     새로운소유그룹으로 파일(디렉토리) 권한변경

head      :     파일내용을 처음부터 몇행까지 보고싶을때.
tail        :     파일내용을 끝부분부터 보고 싶을때(Log를 실시간으로 확인할때 주로사용)

find       :     원하는 파일을 찾을때 사용    >>    find [디렉토리경로] [옵션] [파일명]
du        :     용량 확인하기
man      :     도움말
Putty 사용팁
-한글 보기
Window >> Translation >> ComboBox에서 UTF-8 로변경

-백스페이스(잘안됨)
Terminal >> Keyboard >>The Backspace Key >> 을 control-H 로 변경

-이전 입력한 명령어
Esc + K

-파일명 자동완성
Esc + \

posted by 인생의무한루프
2010. 4. 11. 20:09 Appication/VC++

SQLite 와 C++ 연동방법

어플리케이션을 개발하다보면 로컬에 자료를 저장할 필요성이 발생하는 경우가 있습니다.

단순하게 ini 나  레지스트리 수준으로 저장할 분량이라면 문제가 안되겠지만

좀더 양이 방대해졌을 경우 예를 들어 음악파일 리스트 같은 들어보면 단순하게

이정보를 파일 형태로 저장하기 보다는 데이타베이스로 저장할 필요성이 생기게 됩니다.

 

그렇다고 어플리케이션용 데이타 베이스로 MSSQL 이나 오라클 같은 엔터프라이즈급 데이타베이스를

쓸 수는 없는 상황이구요.

이런 용도에 가장 많이 쓰이는 데이타베이스가 SQLite 입니다. (sqlite 공식 홈페이지 : http://www.sqlite.org/)

 

금번 강좌는 어플리케이션에서 널리 사용되는 SQLite 에 대해 간단한 테이블 생성법, 그리고C++ 로 개발되는

어플리케이션에서 데이터를 불러오고 데이타를 갱신하는 방법에 대해 설명 드리고자 합니다.

 

1> SQLitSpy 프로그램 사용하기

SQLite 전용으로 사용되는 freeware 로 SQLiteSpy.exe 라는 프로그램이 있습니다.

아래 이미지를 보시면 아시겠지만 비 상업적 용도나 교육용으로 사용될때는 별로의 라이센스fee 없이 사용이 가능한 버전입니다.

첨부된 압축 파일을 다운받으시면 프로그램을 보실 수가 있습니다. 

 아래 이미지와 같이 SQLiteSpy 프로그램 실행 후 New Database 메뉴를 클릭하여

db 파일을 생성합니다.

참고로 전 SQLiteExam 이란 다이얼로그베이스 어플리케이션을 만들고 sample.db 파일을 생성했습니다.

 




테이블을 하나 만들어 보겠습니다.

- 생성한 sample.db 파일을 open 합니다.

 -Execute -> Execute SQL 로 아래의 SQL 을 실행합니다.

CREATE TABLE sample_product (product_code TEXT ,
product_name TEXT,
Update_dates DATE)

sample_product 란 테이블을 생성합니다.



성공적으로 테이블이 생성됨을 확인합니다.



기본적인 SQL 구문에 대해서는 아래 링크를 참조하시기 바랍니다.

http://www.sqlite.org/lang.html

2>C++과 연동하기

- CppSQLite3U.cpp , CppSQLite3U.h, sqlite3.h 를 프로젝트에 추가합니다.

  *공개된 Open 소스로 Wrapper Class 역할을 합니다.

 



-sqlite3.lib 참조를 추가합니다.

 

-SQLiteExamDlg.h 에 헤더파일(CppSQLite3U.h)을 include 시키며 멤버 변수(CppSQLite3DB m_DB)를 선언합니다.

동적으로 함수 두개(입력 ,조회)를 생성합니다. 

 
- OnInitDilaog 에서 DB 오픈하며, 입력 조회 부분의 함수를 아래와 같이 구현합니다. 

#include "stdafx.h"
#include "SQLiteExam.h"
#include "SQLiteExamDlg.h"
#include <time.h>

#ifdef _DEBUG
#define new DEBUG_NEW
#endif

#define MAIN_DB_FILE_NAME       _T("sample.db")

중략....

BOOL CSQLiteExamDlg::OnInitDialog()
{
 CDialog::OnInitDialog();

 // Add "About..." menu item to system menu.

 // IDM_ABOUTBOX must be in the system command range.
 ASSERT((IDM_ABOUTBOX & 0xFFF0) == IDM_ABOUTBOX);
 ASSERT(IDM_ABOUTBOX < 0xF000);

 CMenu* pSysMenu = GetSystemMenu(FALSE);
 if (pSysMenu != NULL)
 {
  CString strAboutMenu;
  strAboutMenu.LoadString(IDS_ABOUTBOX);
  if (!strAboutMenu.IsEmpty())
  {
   pSysMenu->AppendMenu(MF_SEPARATOR);
   pSysMenu->AppendMenu(MF_STRING, IDM_ABOUTBOX, strAboutMenu);
  }
 }

 // Set the icon for this dialog.  The framework does this automatically
 //  when the application's main window is not a dialog
 SetIcon(m_hIcon, TRUE);   // Set big icon
 SetIcon(m_hIcon, FALSE);  // Set small icon

 // TODO: Add extra initialization here
 

//DB 파일을 여는 부분입니다
 CString sDBFilePath;
 sDBFilePath.Format(_T("%s"), MAIN_DB_FILE_NAME);
 
 m_DB.open(sDBFilePath);

 return TRUE;  // return TRUE  unless you set the focus to a control
}

 

//insert 구문 예제 부분입니다

void CSQLiteExamDlg::OnBnClickedInput()
{  
  //제품 코드를 입력합니다.

  //난수를 발생시켜 문자열화 한후 입력하는 예제입니다
  int pCode = rand();
  CString pProduct_code,sQuery;
  
  pProduct_code.Format(_T("%d"),pCode);
 
  sQuery.Format(_T("INSERT INTO sample_product (product_code, product_name, update_dates) VALUES ( '%s','aaaaa',current_timestamp)"),pProduct_code);

  
  m_DB.execQuery(sQuery);

 // TODO: Add your control notification handler code here
}

 

//select  구문 예제 부분입니다

void CSQLiteExamDlg::OnBnClickedSelect()

 CString sQuery;

 //전체 제품 갯수를 가져옴
 sQuery =  _T("SELECT count(*) FROM sample_product");

 CppSQLite3Query pCountSql = m_DB.execQuery(sQuery);
 while( ! pCountSql.eof() )
 { 
  CString sCount =  pCountSql.fieldValue(0);
  
   pCountSql.nextRow();
 }
 
  // TODO: Add your control notification handler code here
}

 -입력 결과를 SQLiteSpy 프로그램에서 확인합니다.



이상입니다.


출처 : Pop Generation.. (http://blog.naver.com/elastica/50036176756)

posted by 인생의무한루프