CSS3 동위 선택자

2015. 7. 22. 22:10

<!DOCTYPE html>

<html lang="ko">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style>

         h2 + h2  {
            background-color: red;
        }

         h1 ~ h2 {
             background-color: blue;
         }

    </style>
</head>


<body>
    <h1>Header-1</h1>
    <h2>Header-2</h2>
    <h2>Header-2</h2>
    <h2>Header-2</h2>
    <h2>Header-2</h2>

</body>
</html>

 

A + B 는 코드 배치 상 A 태그 뒤에 오는 B 선택

A ~ B 는 태그 계층 구조 상 A 뒤에 오는 모든 B 선택

'' 카테고리의 다른 글

font-family  (0) 2015.07.23
HTML5 Custom Data Attribute  (0) 2015.07.22
HTML name과 id 태그 차이점  (0) 2015.07.22
code / samp / kbd / var / pre 태그 차이  (0) 2015.07.22
HTML 태그 약어 정리  (0) 2015.07.22
Posted by 캐논볼
,

▶ name
(1) document.폼객체명.폼원소명.value
(2) document.getElementsByName("name")


name page 안에서 중복되어 사용이 가능하며 action에 해당하는 페이지로 전달하는 파라미터로 사용된다.

GET/POST 방식으로 값을 전달하고 싶은 TAG에 사용. Form 객체들(input , radio box ,checkbox )에서 전송되어지는 Parameter의 Key값으로 사용이 됩니다. 서버단에서는 request.getParameter(parameterName) 이런 식으로 값을 가져오죠.


 

 id
(1) document.all.id.value
(2) id.value
(3) document.getElementById("폼 id").value

 

 id page 안에서 중복 사용 불가하며 주로 JavaScript에서 다룰려고 지정하는 것이다. name도 자바스크립트로 속성이나 값을 변경 할 수 있으나 중복값을 갖기 때문에 id로 접근하는 것을 주로 사용한다. document.getElementById(id) 를 통해서 해당 엘리먼트Object 를 가져온다.

XML문서(DOM Tree) 내에서 node를 식별하는 용도로 사용되어 페이지 안에 이름이 한개만 존재해야 한다.

보통은 특정 tag를 지정하기 위해서 사용합니다. 태그 내용을 바꾸는 dhtml 작업에서 주로 사용합니다.

참고로 id로 설정된 값은 서버쪽으로 파라미터로 넘어가지 않기 때문에 서버쪽에서 접근이 안된다.

 

* 파이어 폭스나 크롬에서는 document.getElementById는 id로만 읽습니다.

 

 

'' 카테고리의 다른 글

font-family  (0) 2015.07.23
HTML5 Custom Data Attribute  (0) 2015.07.22
CSS3 동위 선택자  (0) 2015.07.22
code / samp / kbd / var / pre 태그 차이  (0) 2015.07.22
HTML 태그 약어 정리  (0) 2015.07.22
Posted by 캐논볼
,

 

<code>태그는 컴퓨터나 프로그래밍 코드 일부를 그대로 표시하고자 할 때 유용합니다

 

<samp>태그는 컴퓨터 프로그램에서 샘플을 출력할 때

 

<kbd>태그는 키보드 입력을 지정할 때

 

<var>태그는 변수를 입력할 때 유용합니다.

 

 

<pre> 역시, 미리 작성된 텍스트를 있는 그대로 표시해주며, 블록 형태로 사용될 수 있습니다.

 

즉, 여러 줄의 코드를 그대로 출력하고자 할 때  위의 code, samp, kbd, var등을 둘러싼 형태로 사용 합니다.

 

 

code 사용 예:

 

 

<pre><code>function Panel(element, canClose, closeHandler) {
  this.element = element;
  this.canClose = canClose;
  this.closeHandler = function () { if (closeHandler) closeHandler() };
}</code></pre>

 

 

▶실행화면

 

function Panel(element, canClose, closeHandler) {
  this.element = element;
  this.canClose = canClose;
  this.closeHandler = function () { if (closeHandler) closeHandler() };
}

 

 

 

 

samp 사용 예:

 

<p>컴퓨터를 하던 중 <samp>Oops…the system encountered a problem (#707)</samp>라는 에러 메시지가 떴다</p>

 

 

▶실행화면

 

컴퓨터를 하던 중 Oops…the system encountered a problem (#707)라는 에러 메시지가 떴다

 

kbd 사용 예: 

 

<p>취소하려면 <kbd><kbd>Ctrl</kbd>+<kbd>z</kbd></kbd>를 입력하시오</p>

 

 

▶실행화면

취소하려면 Ctrl+z를 입력하시오

 

 

var 사용 예:  

 

<p><var>n</var>의 수만큼 곱하시오</p>

 

▶실행화면

 

n의 수만큼 곱하시오

 

 

pre 사용 예:

 

<pre>                maxling

it is with a          heart
               heavy

that i admit loss of a feline
        so           loved

a friend lost to the
        unknown
                                (night)

~cdr 11dec07</pre>  

 

▶실행화면

 

                maxling

it is with a          heart
               heavy

that i admit loss of a feline
        so           loved

a friend lost to the
        unknown
                                (night)

~cdr 11dec07

 

'' 카테고리의 다른 글

font-family  (0) 2015.07.23
HTML5 Custom Data Attribute  (0) 2015.07.22
CSS3 동위 선택자  (0) 2015.07.22
HTML name과 id 태그 차이점  (0) 2015.07.22
HTML 태그 약어 정리  (0) 2015.07.22
Posted by 캐논볼
,

HTML 태그 약어 정리

2015. 7. 22. 13:50

<a href="url"> ... </a>   anchor hypertext reference="url"    
         
<b> ... </b>   bold   텍스트를 볼드체로 표현
<body bgcolor="#000000">   body background color="#000000"   배경색 지정
<br> ... </br>   break   줄을 바꾸지만, 새로운 문단이 시작되지는 않음
         
<dd> ... </dd>   definition-list definition    
<dl> ... </dl>   definition list     
<dt> ... </dt>   definition-list term    
         
<em> ... </em>   emphasized text    
         
<hr>   horizontal rule   수평선
<h1> ... </h1>   header 1   표제어의 크기. "h1"이 가장 크고, "h6"이 가장 작음
         
<i> ... </i>    italic   글꼴을 이탤릭체로 표현
<img src="url" alt="text">   image source = "url" alternate text = "text"    
         
<kbd> ... </kbd>   keyboard text    
         
<li> ... </li>   listed item    
         
<ol> ... </ol>   ordered list    번호 있는 목록
         
<p> ... </p>   paragraph   문단의 새로운 시작을 위해 줄을 바꾸고, 한 줄을 띄운 후 내용이 시작
<pre> ... </pre>   preformatted text    
         
<samp> ... </samp>   sample computer code    
<sub> ... </sub>   subscript   텍스트를 아래 첨자로 만듦 
<sup> ... </sup>   superscript   텍스트를 윗 첨자로 만듦 
         
<td> ... </td>   table data   데이터 정보를 갖는 셀
<th> ... </th>   table heading   헤더 정보를 갖는 셀
<tr> ... </tr>   table row    
<tt> ... </tt>   teletype text    
         
<u> ... </u>   underline   문장 아래에 밑줄을 그음 
<ul> ... </ul>   unordered list    번호 없는 목록
         
<var> ... </var>   variable    
< ... vlink="color" ...>   visited link    

 

 

'' 카테고리의 다른 글

font-family  (0) 2015.07.23
HTML5 Custom Data Attribute  (0) 2015.07.22
CSS3 동위 선택자  (0) 2015.07.22
HTML name과 id 태그 차이점  (0) 2015.07.22
code / samp / kbd / var / pre 태그 차이  (0) 2015.07.22
Posted by 캐논볼
,

구글 파워 서칭

IT 생활 2015. 7. 21. 16:53

http://www.powersearchingwithgoogle.com/

'IT 생활' 카테고리의 다른 글

익스플로러 우클릭 해제  (0) 2015.08.19
윈도우 레지스트리  (0) 2015.08.06
N40L 설정 관련 링크  (0) 2013.03.04
Servlets & JSP 용어정리  (0) 2012.02.16
서블릿 서버, 서블릿 컨테이너, JSP 컨테이너, 웹서버  (0) 2012.02.16
Posted by 캐논볼
,

정확하게는

 jobs    <- 프로세스 확인하시고
 fg %num    <- 해당 vi 를 포그라운드로 다시 시작

'리눅스' 카테고리의 다른 글

리눅스 백업 관련  (0) 2015.08.31
DNS zone 파일  (0) 2015.08.27
Timestamp 이용하기  (0) 2015.08.19
"su" 와 "su - root" 차이  (0) 2015.08.10
Redhat Package Manager - RPM  (0) 2015.07.20
Posted by 캐논볼
,

### Associative Array

 

<?php
$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");
echo "Peter is " . $age['Peter'] . " years old.";
?>

 

<?php
$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");

foreach($age as $x => $x_value) {
    echo "Key=" . $x . ", Value=" . $x_value;
    echo "<br>";
}
?>

 

### super global variable

 

<?php
echo $_SERVER['PHP_SELF'];
echo "<br>";
echo $_SERVER['SERVER_NAME'];
echo "<br>";
echo $_SERVER['HTTP_HOST'];
echo "<br>";
echo $_SERVER['HTTP_REFERER'];
echo "<br>";
echo $_SERVER['HTTP_USER_AGENT'];
echo "<br>";
echo $_SERVER['SCRIPT_NAME'];
?>

 

### HTML 특수문자 치환

<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

 

### HTML FORM 검사 예

<?php
// define variables and set to empty values
$name = $email = $gender = $comment = $website = "";

if ($_SERVER["REQUEST_METHOD"] == "POST") {
  $name = test_input($_POST["name"]);
  $email = test_input($_POST["email"]);
  $website = test_input($_POST["website"]);
  $comment = test_input($_POST["comment"]);
  $gender = test_input($_POST["gender"]);
}

function test_input($data) {
  $data = trim($data);
  $data = stripslashes($data);
  $data = htmlspecialchars($data);
  return $data;
}
?>

 

 

### strtotime

 

<?php
$d=strtotime("tomorrow");
echo date("Y-m-d h:i:sa", $d) . "<br>";

$d=strtotime("next Saturday");
echo date("Y-m-d h:i:sa", $d) . "<br>";

$d=strtotime("+3 Months");
echo date("Y-m-d h:i:sa", $d) . "<br>";
?>

 

<?php
$startdate = strtotime("Saturday");
$enddate = strtotime("+6 weeks",$startdate);

while ($startdate < $enddate) {
  echo date("M d", $startdate),"<br>";
  $startdate = strtotime("+1 week", $startdate);
}
?>

 

### include vs required

The require statement is also used to include a file into the PHP code.

However, there is one big difference between include and require; when a file is included with the include statement and PHP cannot find it, the script will continue to execute:

 

 

### fgets vs fgetc

<?php
$myfile = fopen("webdictionary.txt", "r") or die("Unable to open file!");
// Output one line until end-of-file
while(!feof($myfile)) {
  echo fgets($myfile) . "<br>";
}
fclose($myfile);
?>

 

<?php
$myfile = fopen("webdictionary.txt", "r") or die("Unable to open file!");
// Output one character until end-of-file
while(!feof($myfile)) {
  echo fgetc($myfile);
}
fclose($myfile);
?>

 

 

### fopen 옵션

http://unikys.tistory.com/273

'프로그래밍' 카테고리의 다른 글

PHP 날짜함수 정리  (0) 2015.08.24
MySQL Type 종류  (0) 2015.08.19
BASH shell script - connect to MySQL  (0) 2015.08.19
MySQL 권한 설정  (0) 2015.08.19
PHP echo와 print의 차이  (0) 2015.07.23
Posted by 캐논볼
,
패키지설치
#rpm -i 패키지이름
 
패키지업그레이드
#rpm -U 패키지이름
 
패키지 삭제
#rpm -e 패키지이름
 
패키지 쿼리
#rpm -q 패키지이름
 
 
 
RPM명령어중 주로 사용하는 명령어
 
패키지 설치시
#rpm -ivh 패키지이름
 
패키지 업그레이드시
#rpm -Uvh 패키지이름
 
패키지 삭제시
#rpm -e 패키지이름

 

'리눅스' 카테고리의 다른 글

리눅스 백업 관련  (0) 2015.08.31
DNS zone 파일  (0) 2015.08.27
Timestamp 이용하기  (0) 2015.08.19
"su" 와 "su - root" 차이  (0) 2015.08.10
vim ctrl+z 후 복귀 = fg  (0) 2015.07.20
Posted by 캐논볼
,
Panel과 Rack의 치수
1. 적용범위 (scope)
이 standard는 실측 482.6mm (19 in)에 기초하고 있는 모든 응용장비의 "Panel"과 "Rack"에 적용된다.
2. Panel의 치수
"U"자가 상징하는 바는, 44.45mm(1.750in)의 "수직선 길이의 증가(vertical increment)다.

 

Fig

Type du panncau=

A

E

Z

Y

A

E

Z

Y

Panel type=

dimensions en mm Sizes in

dimensions en mm Sizes in

 

mm(tolerance ±0.4)(tolerance ±4)

mm(tolerance±0.4)(tolerance±4)

1

1U

5,9

43,6

-

-

0,234

1,719

-

-

2U

37,7

88,1

-

-

1,484

3,469

-

-

2

1U

5,9

43,6

31,8

-

0,234

1,719

1,250

-

2U

5,9

88,1

76,2

-

0,234

3,469

3,000

-

3U

37,7

132,5

57,15

-

1,484

5,219

2,250

-

4U

37,7

177,0

101,6

-

1,484

6,969

4,000

-

5U

37,7

221,4

146,1

-

1,484

8,719

5,750

-

6U

37,7

265,9

190,5

-

1,484

10,469

7,500

-

3

6U

37,7

265,9

57,15

76,2

1,484

10,469

2,250

3,000

7U

37,7

310,3

88,9

57,15

1,484

12,219

3,500

2,250

8U

37,7

354,8

101,6

76,2

1,484

13,969

4,000

3,000

9U

37,7

399,2

101,6

120,6

1,484

15,719

4,000

4,750

10U

37,7

443,7

133,3

165,1

1,484

17,469

4,000

6,500

11U

37,7

488,1

133,3

146,1

1,484

19,219

5,250

5,750

12U

37,7

532,6

133,3

190,6

1,484

20,969

5,250

7,500

* Voir Figure 6, page 7. See Figure 6, page 7.

3. Slot의 세부사항


4. Rack의 치수(Rack dimensions)
유의사항 - 통상적 실측 : 7.9 ± 0.8 mm : 0.312 ± 0.031 in
4.1 1m 간격 내의 어느 두 hole 사이의 공차(tolerance) : ± 0.4mm ; (39.3 ±0.015in) 
 
4. 2 추가의 hole들도 허용된다.

 
 

482.6mm(19inch)로 구성된 기구의 치수
Part 2 : Rack 구조물의 Cabinet과 Pitch 
1. 적용범위 (Scope)
이 Standard는 free-standing cabine*t 과 482.6mm(19inch)의 rack에 쓰여지는 고정된 rack 구조물과 Panel로 된 실제의 전자장비를 cover한다. (적용대상으로 한다.)
* free-standing : 그 자체로서 하나의 완성품인, 기타 다른 장치의 부속물이 아닌.
2. 캐비닛 설명 (Cabinet Description)
이 standard의 목적을 위해서, "Cabinet"은, "타 장치의 도움 없이 이용될 수 있는 전자장비의 인클로저 또는 free standing", 혹은 "전체를 구성하는 cabinet들의 조합의 한 부분"으로 정의할 수 있다. Cabinet은, 사용자의 적재물을 운반한다던가, 이동 해야 할 필요성에 의거하여, plinth(대좌), feet, roller, castar(가구의 다리에 붙인 바퀴) 등을 부착하거나 하지 않거나 하게 된다.
Cabinet은 응용장치에 부합하기 위하여 한 측면에 혹 여러 측면에 "side panel"과 "door"를 부착하게 된다.
Cabinet은 "IEC Publication 297"에 맞추어서 Panel이 부착 되어질 수 있는 vertical
member"들을 내장하거나 편입하게 될 것이다.
* Vertical member : 수직으로 세워서 이용하는 부품
Rack이란 door나 covering이 없는 금속의 구조물이다.
3. Cabinet - 기본치수
 

유의할 점
1. 높이 "H"와 깊이 "D"의 값은, "통상의 생산 공차(Normal production tolerance)가 적용되는 전체길이의 cabinet 치수이다. 이 높이는 castor(바퀴)와 pedestal(주각)을 포함한다.
2. 높이에서, 200mm (7.97inch)의 증가분(increments)이 선택되었다.
(2×200mm = 9U)
3. 피치(pitch)는 "P"는, "열"중에서(in a row) cabinet의 장착을 위한, 기준선(datum line) 사이의 이론적 거리이다.
폭 "w"가 "P"보다 작게 공차가 주어지고
결정되어야, 한 벌의 cabinet이, 소요
pitch(required pitch)와 함께 가설되어질 수
있다.
특별한 경우에는 기타의 다른 Pitch가 요구 되
어질 수 있다. 이것은 100mm 내의 증가분
(increments)으로 되어야 한다.
4. "깊이"는 200mm의 (7.97인치)의 증가분(increments)이 결정되어진다. 450mm(17.71inch)의 중간 size는 C.C.I.T.T.(국제 전신 전화 협의체) 내에서 추천되어진 값이다.
5. S는 panel과 sub.rack을 장착하기 위한 수직의 개구(aperture)를 가리키며, 단지 상징적인 크기에 불과하다. "U"는 IEC publication 297에 따른 44.54mm (1.75인치)의 수직 증가분(vertical increments)이다.
6. 치수의 결정의 위하여는, IEC publication 297을 참고하라.
Heightmm8001000120014001600180020002200
Inch31.4939.3747.2455.1162.9979.8478.7486.61
Snx U13x U18x U22x U27x U31x U36x U40x U45x U
          
Pitch Pmm550600700800900   
W<P Inch21.6523.6227.5531.4935.43   
          
Depthmm400450600650800900  
Inch15.7417.7123.6225.5931.4935.43  
          
P 550 스페이스가 600mm 보다 적게 제한되는 곳의, 그리고 cabinet 내의 side cabling이 최소인 곳에서의 응용에서.
P 700 원칙적으로 회전식 rack (swinging rack)을 포함하는 응용에서.
D 450 450mm의 기본 깊이(basic depth)는, 보수를 위한 조절간격, cooling fins, 그리고 앞면과 뒷면의 cover를 추가해서 전체의 깊이가 520mm까지 되도록 허용하는, "C.C.I.T.T.의 추천 C 231"과 일치한다.
D 650 금후(今後)의 응용을 위해서 권장되지 않는다.
4. 고정된 rack의 구조 - 설명 (Fixed rack structures - Description)
이 Standard의 목적을 위해, 고정된 rack(fixed rack)의 구조란, 미리 결정된 pitch의 간격을 채우고, "바닥의 마루(floor at the bottom)"와 "상층부의 천정(ceiling) 그리고/혹은 벽(wall)"에 대해 고정되는, 일련의 Vertical member의 조합이라고 정의된다.
각각의 Vertical member의 조합은, IEC rack의 이론 상의 중심거리와 동등하다.
각각의 rack의 Vertical member는 pitch가 유지된다는 전제하에서, 인접한 rack의 Vertical member와 유리(遊離)
되거나, 결합 되어진다.


'길어올린 자료' 카테고리의 다른 글

20대 추천 도서  (0) 2012.07.02
영어 회화 표현  (0) 2012.07.02
인디언식 이름짓는 방법  (0) 2012.01.10
초지향성 스피커  (0) 2012.01.06
Color Table  (0) 2012.01.02
Posted by 캐논볼
,

ex) WS-2960S-48FPD-L


1) WS - Workgroup Switch

2) 2960S - LINE UP

- G : 1G 지원할 경우 ex) 2960G

 - PD : input poe ex) 2960CPD

3) 48 : 24/48등 지원하는 포트의 개수

4) FP - 다운링크 Poe 지원 여부

- FP : Full POE (48port) ex) 740W

 - LP : Low POE (48port) ex) 370W

 - P : POE (24port full poe)

 - L : Low (24port low poe)

- T : NON-POE (UTP형)

- S : 1Giga SFP module slot (SFP모듈형) 

5) D - Uplink 종류

- D : 10G Uplink

- T : 1000baseT (UTP형 업링크 포트) 

- S : SFP ( SFP형 업링크포트 모듈 슬롯)

- C : Combo (SFP/1000BaseT) (UTP/SFP 선택사용 듀얼 업링크 포트) 

- ST : SFP + 1000baseT

6) L - 소프트웨어

- L : Lan Base

 - S : Lan Lite

 E=Enhanced Multilayer Image (Called IP Service) 다이나믹 라우팅프로토콜 전부 지원 

S=Standard Multilayer Image (Called IP Base) 다이나믹 라우팅 미지원 



Posted by 캐논볼
,