Bootstrap Text/Typography
description : Bootstrap Text/Typography
author : 오션
email : shlim@repia.com
... Bootstrap heading
Lighter, Secondary Text
The small element is used to create a lighter, secondary text in any heading:
h1 heading secondary text
CSS Text
description : CSS (Cascading Style Sheets) text color, alignment, decoration,transformation, spacing,... tupdate : 2021-03-08
Source of the article
CSS text
CSS Text Alignment
CSS Text Decoration
CSS Text Transformation
CSS Text Spacing
CSS Text Shadow
C
a. The whole link area is clickable, not just the text.
Note: overflow:hidden is added to the ul ele... lay: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover {
... lay: block;
color: white;
text-align: center;
padding: 14px 16px;
Javascript HTML DOM textContent Property
description : Javascript HTML (HyperText Markup Language) DOM textContent Property
author : 오션
email : ... 07
The source of the article
Javascript HTML DOM textContent Property
Example
요소의 내부 텍스트(inner text)를 가져옵니다.
<body>
<p>Click the button to get the te
s easily accessible via quickbuttons, too.
Basic Text Formatting
DokuWiki supports bold, italic, underlined and monospaced texts. Of course you can combine all these.
DokuWiki s... **, //italic//, __underlined__ and ''monospaced'' texts.
Of course you can **__//''combine''//__** all t... by a whitespace or the end of line.
This is some text with some linebreaks
Note that the
two backslashe
at the whole link area is clickable, not just the text.
예제 설명
display: block; - 링크를 블럭 요소로 표시하면, 텍스트뿐만... at the whole link area is clickable, not just the text.
Vertical Navigation Bar Examples
회색 컬러의 배경으로, 기... ddddd;
padding: 8px 16px;
text-decoration: none;
}
/* Change the... ddddd;
padding: 8px 16px;
text-decoration: none;
}
li a.active {
편리합니다.
배열로 작업하는 경우가 해당합니다.
Instead of writing
text += cars[0] + "<br>";
text += cars[1] + "<br>";
text += cars[2] + "<br>";
text += cars[3] + "<br>";
text += cars[4] + "<br>";
text += cars[5] + "<br>";
You
e position of the first occurrence of a specified text:</p>
<p id="demo"></p>
<script>
let str =... the positon of the last occurrence of a specified text:</p>
<p id="demo"></p>
<script>
let str =... oth indexOf() and lastIndexOf() returns -1 if the text is not found:</p>
<p id="demo"></p>
<script>
... e position of the first occurrnece of a specified text in a string.</p>
<p id="demo"></p>
<script>
(6)도 일요일 (0)이 아닌 경우. default 메시지를 작성합니다.
let text;
switch (new Date().getDay()) {
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
break;
default:
text = "Looking forward to the Weekend";
}
doc
DOM innerText Property
Example
요소의 내부 텍스트(inner text)를 가져옵니다.
<body>
<p>Click the button to get the text content of the button element.</p>
<button o... ('myBtn').innerText;
/* id="myBtn"의 inner text "Try it"을 가져와 변수 x에 대입*/
document.getElem... 거되고, 지정된 문자열을 포함하는 단일 텍스트 노드로 대체됩니다.
Note: 이 속성은 textContent 속성과 비슷하지만 몇 가지 차이점이 있습니다.
textContent는 모
escapeHtml
1. Encryption - escapeHtml 선택 - Input Text 입력란에 입력 후,
<p>MyName<p>
2. Encrypt Text 버튼을 클릭 시 Input Text 입력란에 입력되어 있던 상기 코드가 아래와 같이 변경되는 이유는
<p>MyName<p>
2.1 - 이때 Encryption - Input Text 입력란은 아래와 같이 코딩되어 있었고,
<input id="encryptInptText
