일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- jQuery
- 게시판
- Selector
- Android
- 안드로이드 AVD
- #청주주님의교회
- 프로그래밍
- 회원가입
- JavaScript
- CSS
- Intent
- 제이쿼리
- 생명주기
- 아이콘
- 자바
- Spring
- 웹개발
- 안드로이드
- Activity
- 에디터
- Java
- 인텐트
- androidstudio
- Resources
- 청주
- TinyMCE
- 영성
- 주님의교회
- java 8
- 글쓰기
- Today
- Total
공부하는 블로그
필수 Tag 정리 본문
<a> Tag
Example
A link to W3Schools.com:
<a href="https://www.w3schools.com">Visit W3Schools.com!</a>
A link to W3Schools.com:
<a href="https://www.w3schools.com">Visit W3Schools.com!</a>
More "Try it Yourself" examples below.
Definition and Usage
The <a> tag defines a hyperlink, which is used to link from one page to another.
The most important attribute of the <a> element is the href attribute, which indicates the link's destination.
By default, links will appear as follows in all browsers:
- An unvisited link is underlined and blue
- A visited link is underlined and purple
- An active link is underlined and red
<b> Tag
Example
<p>This is normal text - <b>and this is bold text</b>.</p>
<p>This is normal text - <b>and this is bold text</b>.</p>
Definition and Usage
The <b> tag specifies bold text.
<body> Tag
Example
A simple HTML document, with the minimum of required tags:
<html>
<head>
<title>Title of the document</title>
</head>
<body>
The content of the document......
</body>
</html>
A simple HTML document, with the minimum of required tags:
<html>
<head>
<title>Title of the document</title>
</head>
<body>
The content of the document......
</body>
</html>
Definition and Usage
The <body> tag defines the document's body.
The <body> element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc.
<br> Tag
Example
A line break is marked up as follows:
This text contains<br>a line break.
A line break is marked up as follows:
This text contains<br>a line break.
Definition and Usage
The <br> tag inserts a single line break.
The <br> tag is an empty tag which means that it has no end tag.
<dd><dl><dt>
Example
A description list, with terms and descriptions:
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
Definition and Usage
The <dd> tag is used to describe a term/name in a description list.
The <dd> tag is used in conjunction with <dl> (defines a description list) and <dt> (defines terms/names).
Inside a <dd> tag you can put paragraphs, line breaks, images, links, lists, etc..
Example
A description list, with terms and descriptions:
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
Definition and Usage
The <dl> tag defines a description list.
The <dl> tag is used in conjunction with <dt> (defines terms/names) and <dd> (describes each term/name).
Example
A description list, with terms and descriptions:
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
Definition and Usage
The <dt> tag defines a term/name in a description list.
The <dt> tag is used in conjunction with <dl> (defines a description list) and <dd> (describes each term/name).
<div>
Example
A section in a document that will be displayed in blue:
<div style="color:#0000FF">
<h3>This is a heading</h3>
<p>This is a paragraph.</p>
</div>
A section in a document that will be displayed in blue:
<div style="color:#0000FF">
<h3>This is a heading</h3>
<p>This is a paragraph.</p>
</div>
Definition and Usage
The <div> tag defines a division or a section in an HTML document.
The <div> tag is used to group block-elements to format them with CSS.
<form> Tag
Example
An HTML form with two input fields and one submit button:
<form action="/action_page.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
An HTML form with two input fields and one submit button:
<form action="/action_page.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
More "Try it Yourself" examples below.
Definition and Usage
The <form> tag is used to create an HTML form for user input.
The <form> element can contain one or more of the following form elements:
<h1>-<h6> Tag
Example
The six different HTML headings:
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
The six different HTML headings:
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
Definition and Usage
The <h1> to <h6> tags are used to define HTML headings.
<h1> defines the most important heading. <h6> defines the least important heading.
<hr> Tag
Example
Use the <hr> tag to define a thematic change in the content:
<h1>HTML</h1>
<p>HTML is a language for describing web pages.....</p>
<hr>
<h1>CSS</h1>
<p>CSS defines how to display HTML elements.....</p>
Use the <hr> tag to define a thematic change in the content:
<h1>HTML</h1>
<p>HTML is a language for describing web pages.....</p>
<hr>
<h1>CSS</h1>
<p>CSS defines how to display HTML elements.....</p>
Definition and Usage
The <hr> tag defines a thematic break in an HTML page (e.g. a shift of topic).
The <hr> element is used to separate content (or define a change) in an HTML page.
<html>
Example
A simple HTML5 document:
<!DOCTYPE HTML>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
The content of the document......
</body>
</html>
A simple HTML5 document:
<!DOCTYPE HTML>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
The content of the document......
</body>
</html>
Definition and Usage
The <html> tag tells the browser that this is an HTML document.
The <html> tag represents the root of an HTML document.
The <html> tag is the container for all other HTML elements (except for the <!DOCTYPE> tag).
<i>
Example
<p>He named his car <i>The lightning</i>, because it was very fast.</p>
<p>He named his car <i>The lightning</i>, because it was very fast.</p>
Definition and Usage
The <i> tag defines a part of text in an alternate voice or mood. The content of the <i> tag is usually displayed in italic.
The <i> tag can be used to indicate a technical term, a phrase from another language, a thought, or a ship name, etc.
Use the <i> element only when there is not a more appropriate semantic element, such as:
- <em> (emphasized text)
- <strong> (important text)
- <mark> (marked/highlighted text)
- <cite> (the title of a work)
- <dfn> (a definition term)
<img>
Example
How to insert an image:
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
How to insert an image:
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
More "Try it Yourself" examples below.
Definition and Usage
The <img> tag defines an image in an HTML page.
The <img> tag has two required attributes: src and alt.
Note: Images are not technically inserted into an HTML page, images are linked to HTML pages. The <img> tag creates a holding space for the referenced image.
Tip: To link an image to another document, simply nest the <img> tag inside <a> tags.
<input>
Example
An HTML form with three input fields; two text fields and one submit button:
<form action="/action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
An HTML form with three input fields; two text fields and one submit button:
<form action="/action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
Definition and Usage
The <input> tag specifies an input field where the user can enter data.
<input> elements are used within a <form> element to declare input controls that allow users to input data.
An input field can vary in many ways, depending on the type attribute.
<label>
Example
Three radio buttons with labels:
<form action="/action_page.php">
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female"><br>
<label for="other">Other</label>
<input type="radio" name="gender" id="other" value="other"><br><br>
<input type="submit" value="Submit">
</form>
Three radio buttons with labels:
<form action="/action_page.php">
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female"><br>
<label for="other">Other</label>
<input type="radio" name="gender" id="other" value="other"><br><br>
<input type="submit" value="Submit">
</form>
Definition and Usage
The <label> tag defines a label for an <input> element.
The <label> element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the <label> element, it toggles the control.
The for attribute of the <label> tag should be equal to the id attribute of the related element to bind them together.
<ol><li>
Example
One ordered (<ol>) and one unordered (<ul>) HTML list:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
One ordered (<ol>) and one unordered (<ul>) HTML list:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
More "Try it Yourself" examples below.
Definition and Usage
The <li> tag defines a list item.
The <li> tag is used in ordered lists(<ol>), unordered lists (<ul>), and in menu lists (<menu>).
Example
2 different ordered lists:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
2 different ordered lists:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
Definition and Usage
The <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical.
Use the <li> tag to define list items.
<ul><li>
Example
An unordered HTML list:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
More "Try it Yourself" examples below.
Definition and Usage
The <ul> tag defines an unordered (bulleted) list.
Use the <ul> tag together with the <li> tag to create unordered lists.
Example
One ordered (<ol>) and one unordered (<ul>) HTML list:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
More "Try it Yourself" examples below.
Definition and Usage
The <li> tag defines a list item.
The <li> tag is used in ordered lists(<ol>), unordered lists (<ul>), and in menu lists (<menu>).
<select><option>
Example
Create a drop-down list with four options:
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
Definition and Usage
The <select> element is used to create a drop-down list.
The <option> tags inside the <select> element define the available options in the list.
Example
A drop-down list with four options:
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
Definition and Usage
The <option> tag defines an option in a select list.
<option> elements go inside a <select> or <datalist> element.
<p>
Example
A paragraph is marked up as follows:
<p>This is some text in a paragraph.</p>
More "Try it Yourself" examples below.
Definition and Usage
The <p> tag defines a paragraph.
Browsers automatically add some space (margin) before and after each <p> element. The margins can be modified with CSS (with the margin properties).
<span>
Example
A <span> element used to color a part of a text:
<p>My mother has <span style="color:blue">blue</span> eyes.</p>
Definition and Usage
The <span> tag is used to group inline-elements in a document.
The <span> tag provides no visual change by itself.
The <span> tag provides a way to add a hook to a part of a text or a part of a document.
<table><tr><th>
Example
A simple HTML table, containing two columns and two rows:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
More "Try it Yourself" examples below.
Definition and Usage
The <table> tag defines an HTML table.
An HTML table consists of the <table> element and one or more <tr>, <th>, and <td> elements.
The <tr> element defines a table row, the <th> element defines a table header, and the <td> element defines a table cell.
A more complex HTML table may also include <caption>, <col>, <colgroup>, <thead>, <tfoot>, and <tbody> elements.
Example
A simple HTML table, containing two columns and two rows:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
More "Try it Yourself" examples below.
Definition and Usage
The <tr> tag defines a row in an HTML table.
A <tr> element contains one or more <th> or <td> elements.
Example
A simple HTML table with two header cells and two data cells:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
More "Try it Yourself" examples below.
Definition and Usage
The <th> tag defines a header cell in an HTML table.
An HTML table has two kinds of cells:
- Header cells - contains header information (created with the <th> element)
- Standard cells - contains data (created with the <td> element)
The text in <th> elements are bold and centered by default.
The text in <td> elements are regular and left-aligned by default.
<table><tr></td>
Example
A simple HTML table, with two table cells:
<table>
<tr>
<td>Cell A</td>
<td>Cell B</td>
</tr>
</table>
More "Try it Yourself" examples below.
Definition and Usage
The <td> tag defines a standard cell in an HTML table.
An HTML table has two kinds of cells:
- Header cells - contains header information (created with the <th> element)
- Standard cells - contains data (created with the <td> element)
The text in <th> elements are bold and centered by default.
The text in <td> elements are regular and left-aligned by default.
'Develop > HTML' 카테고리의 다른 글
HTTP 에러코드 정리 (0) | 2017.09.14 |
---|