> 웹 프론트엔드 > HTML 튜토리얼 > HTML의 태그와 해당 콘텐츠에 대한 자세한 소개

HTML의 태그와 해당 콘텐츠에 대한 자세한 소개

巴扎黑
풀어 주다: 2017-06-27 10:05:03
원래의
3714명이 탐색했습니다.




  • head

    • title

    • base

    • meta

    • 링크

    • script

    • style

<head>

<head> 标签用于定义文档的头部,它是所有头部元素的容器。

<head> 中的元素可以:
- 引用脚本
- 指示浏览器在哪里找到样式表
- 提供元信息
- 等等
文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

下面这些标签可用在 head 部分:<base>, <link>, <meta>, <script>, <style>,  <title>

<title>

<title> 定义文档的标题,它是 head 部分中唯一必需的元素

<html><head><title>我的第一个HTML页面</title></head><body><p>body 元素的内容会显示在浏览器中。</p><p>title 元素的内容会显示在浏览器的标题栏中。</p></body></html>
로그인 후 복사
로그인 후 복사

浏览器会以特殊的方式来使用标题,并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样,当把文档加入用户的链接列表或者收藏夹或书签列表时,标题将成为该文档链接的默认名称。

<base>

<base>标签为页面上的所有链接规定默认地址或默认目标。

通常情况下,浏览器会从当前文档的URL中提取相应的元素来填写相对URL中的空白。
使用<base>标签可以改变这一点。浏览器随后将不再使用当前文档的URL,而使用指定的基本URL来解析所有的相对URL。这其中包括 <a><img><link><form>标签中的 URL。

<html><head><base href="http://www.w3school.com.cn/i/" /><base target="_blank" /></head><body><img src="eg_smile.gif" /><br /><p>图像的地址为相对地址。由于我们已经在 head 部分规定了一个基准 URL,浏览器将在如下地址寻找图片:</p><p>"http://www.w3school.com.cn/i/eg_smile.gif"</p><br /><br /><p><a href="http://www.w3school.com.cn">W3School</a></p><p>请注意,链接会在新窗口中打开,即使链接中没有 target="_blank" 属性。这是因为 base 元素的 target 属性已经被设置为 "_blank" 了。</p></body></html>
로그인 후 복사
로그인 후 복사

<base>必需的属性:href

href,值为URL,规定页面中所有相对链接的基准URL。

<base>可选的属性:target

target,值为_blank、_parent、_self、_top、framename等,表明在何处打开页面中所有的链接。比如”_blank”意为在新窗口中打开。

<meta>

<meta>元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。元数据总是以“名称/值”的形式被成对传递的。

<meta>标签位于文档的头部,不包含任何内容。<meta>标签的属性定义了与文档相关联的“名称/值”对。

<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta name="author"content="w3school.com.cn"><meta name="revised"content="David Yang,8/1/07"><meta name="generator"content="Dreamweaver 8.0en"></head>
로그인 후 복사
로그인 후 복사

<meta>必需的属性:content

content,值为一些文本,定义了与http-equiv或name属性相关的元信息。元数据总是以名称/值的形式被成对传递的。

eg:

<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1">
로그인 후 복사
로그인 후 복사

<meta><head> 태그는 모든 헤드 요소의 컨테이너인 문서의 헤드를 정의하는 데 사용됩니다. <head>의 요소는 다음을 수행할 수 있습니다.

-
참조 스크립트

- 브라우저에 스타일시트를 찾을 위치를 지시

-

메타 정보 제공

-

기타

문서 헤더는 문서 제목, 웹에서의 위치, 다른 문서와의 관계 등 문서의 다양한 속성과 정보를 설명합니다. 대부분의 문서 헤더에 포함된 데이터는 실제로 독자에게 콘텐츠로 표시되지 않습니다.

헤드 섹션에는 다음 태그를 사용할 수 있습니다:

<base>, <link>, <meta>, <스크립트>, <스타일>, <제목>.

<title>

<title>은 문서의 제목을 정의합니다. < span style="text-장식:underline;">head 섹션에서 유일하게 필요한 요소입니다.


<meta http-equiv="charset" content="iso-8859-1"><meta http-equiv="expires" content="31 Dec 2008">
로그인 후 복사
로그인 후 복사

브라우저에서는 제목을 특별한 방식으로 사용하며 일반적으로 브라우저 창의 제목 표시줄이나 상태 표시줄에 제목을 배치합니다. 마찬가지로 사용자의 링크 목록이나 즐겨찾기 또는 책갈피 목록에 문서가 추가되면 제목이 문서 링크의 기본 이름이 됩니다.

<base>

🎜🎜<base> 태그는 페이지의 모든 링크에 대한 기본 주소 또는 기본 대상을 지정합니다. 🎜🎜🎜일반적으로 브라우저는 현재 문서의 URL에서 해당 요소를 추출하여 상대 URL의 공백을 채웁니다. 🎜이를 변경하려면 <base> 태그를 사용하세요. 그러면 브라우저는 더 이상 현재 문서의 URL을 사용하지 않지만 지정된 기본 URL을 사용하여 모든 상대 URL을 확인합니다. 여기에는 <a>, HTML의 <head> 태그와 해당 콘텐츠에 대한 자세한 소개, <link>, <form>이 포함됩니다. 태그의 URL입니다. 🎜
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" /></head>
로그인 후 복사
로그인 후 복사
🎜<base>필수 속성: 🎜href🎜🎜🎜🎜🎜href🎜, 값은 URL이며 페이지에 있는 모든 상대 링크의 기본 URL을 지정합니다. 🎜🎜🎜<base> 선택적 속성: 🎜target🎜🎜🎜🎜🎜target🎜, 값은 _blank, _parent, _self, _top, 프레임 이름 등이며 파일을 열 위치를 나타냅니다. 페이지 모든 링크. 예를 들어 "_blank"는 새 창에서 열기를 의미합니다. 🎜🎜

<meta>

🎜🎜<meta> 요소는 검색 설명 및 키워드와 같은 페이지에 대한 메타 정보를 제공할 수 있습니다. 엔진 및 업데이트 빈도. 메타데이터는 항상 이름/값 쌍으로 전달됩니다. 🎜🎜🎜 <meta> 태그는 문서의 머리 부분에 있으며 내용을 포함하지 않습니다. <meta> 태그의 속성은 문서와 연관된 이름/값 쌍을 정의합니다. 🎜
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta name="description"content="HTML examples"><meta name="keywords"content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript"></head>
로그인 후 복사
로그인 후 복사
🎜<meta>필수 속성: 🎜content🎜🎜🎜🎜🎜content🎜, 값은 http-equiv 또는 name 속성과 관련된 메타 정보를 정의하는 일부 텍스트입니다. 메타데이터는 항상 이름/값 쌍으로 전달됩니다. 🎜🎜🎜예: 🎜
<meta name="keywords" content="HTML,ASP,PHP,SQL">
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜<meta>주요 선택 속성: 🎜http-equiv🎜, 🎜name🎜🎜🎜🎜🎜http-equiv🎜, 값은 콘텐츠 유형, 만료, 새로 고침, 쿠키 설정 등은 콘텐츠 속성을 HTTP 헤더에 연결합니다. 🎜🎜🎜http-equiv 속성은 이름/값 쌍의 이름을 제공합니다. 그리고 실제 문서를 보내기 전에 브라우저로 보내는 메시지 헤더에 "이름/값" 쌍을 포함하도록 서버에 지시합니다. 🎜예: 🎜
<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜Redirect(웹페이지 재배치용): 🎜
<head><link href="shanghai.htm" rel="parent" charset="en" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜설명 키워드: 🎜
<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜🎜🎜name🎜, 값은 작성자, 설명, 키워드, 생성기, 수정됨, 기타 등입니다. 콘텐츠 속성을 이름으로 지정합니다. 🎜🎜🎜HTML이나 XHTML 태그에는 미리 정의된 이름이 할당되지 않습니다. 일반적으로 귀하와 원본 문서의 독자에게 의미 있는 이름을 자유롭게 사용할 수 있습니다. 🎜"키워드"는 자주 사용되는 이름입니다. 문서의 키워드 세트를 정의합니다. 일부 검색 엔진에서는 이러한 키워드를 사용하여 문서가 발견될 때 문서를 분류합니다. 🎜예:🎜
<meta name="keywords" content="HTML,ASP,PHP,SQL">
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

<link>

<link>链接一个外部样式表。属于在HTML中插入CSS样式表的三种方法之一。

<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

<link>的主要属性:hrefreltypecharset

charset,指明被链接文档的字符集,如UTF-8。但是几乎没有主流浏览器支持 link标签的charset 属性

在下面的例子中,charset 属性指示被链接文档是用英文编写的:

<head><link href="shanghai.htm" rel="parent" charset="en" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

href,规定被链接文档的位置(URL)。

这个不解释了。

rel 属性指示被链接的文档是一个样式表。它的属性值只有 “stylesheet” 得到了所有浏览器的支持。其他值只得到了部分地支持。

<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

type 属性规定被链接文档的 MIME 类型。该属性最常见的 MIME 类型是 “text/css”,该类型描述样式表。

<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

<script>

<script> 标签用于定义客户端脚本,比如 JavaScript。

script 元素既可以包含脚本语句,也可以通过 src 属性指向外部脚本文件。
必需的 type 属性规定脚本的 MIME 类型。
JavaScript 的常见应用时图像操作、表单验证以及动态内容更新。

  • 直接包含脚本语句

<html><body><script type="text/javascript">document.write("<h1>Hello World!</h1>")</script> </body></html>
로그인 후 복사
로그인 후 복사
  • 通过 src 属性指向外部脚本文件

<script type="text/javascript" src="myscripts.js"></script>
로그인 후 복사
로그인 후 복사

<script>必需的属性:type

type,规定脚本的 MIME 类型。

对于不支持脚本的浏览器:

<!DOCTYPE html><html><body><script type="text/javascript">document.write("Hello World!")</script><noscript>Sorry, your browser does not support JavaScript!</noscript><p>不支持 JavaScript 的浏览器将显示 noscript 元素中的文本。</p></body></html>
로그인 후 복사
로그인 후 복사

<style>

<style> 标签用于为 HTML 文档定义样式信息。

在HTML中插入CSS样式表的另外两种方法都是通过style完成的——内部样式表、内联样式。只不过内部样式表用的是style标签<style>,内联样式用的是style属性。

  • 内联样式

<p style="color:blue;margin-left:20px">This is a paragraph.</p>
로그인 후 복사
로그인 후 복사
  • 内部样式表

<html><head><style type="text/css">h1 {color: red}p {color: blue}</style></head><body><h1>header 1</h1><p>A paragraph.</p></body></html>
로그인 후 복사
로그인 후 복사

也可以通过“id选择器”和“class选择器”进行:

  • id选择器

<!DOCTYPE html><html><head><style>#liuhaibo{text-align:center;color:red;} </style></head><body><p id="liuhaibo">Hello World!</p><p>This paragraph is not affected by the style.</p></body></html>
로그인 후 복사
로그인 후 복사
  • class选择器

<!DOCTYPE html><html><head><style>.center{text-align:center;}</style></head><body><h1 class="center">标题居中</h1><p class="center">段落居中。</p> </body></html>
로그인 후 복사
로그인 후 복사

你也可以指定特定的HTML元素使用class。
在以下实例中, 所有的 p 元素使用 class=”center” 让该元素的文本居中,而h1则不可以。

<!DOCTYPE html><html><head><style>p.center{text-align:center;}</style></head><body><h1 class="center">This heading will not be affected</h1><p class="center">This paragraph will be center-aligned.</p> </body></html>
로그인 후 복사
로그인 후 복사

<style>必需的属性:type

type,唯一可能的值是“text/css”,规定样式表的 MIME 类型。

也可以通过style标签创建一个没有下划线的链接:

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta http-equiv="Content-Language" content="zh-cn" /></head><body><a href="/example/html/lastpage.html" style="text-decoration:none">这是一个链接!</a></body></html>
로그인 후 복사
로그인 후 복사

Note:只有title标签<title>、script标签<script>和style标签<style>有完整的关闭标签。



  • head

    • title

    • base

    • meta

    • link

    • script

    • style

<코드>< ;head>

<head>

<head> 标签用于定义文档的头部,它是所有头部元素的容器。

<head> 中的元素可以:
- 引用脚本
- 指示浏览器在哪里找到样式表
- 提供元信息
- 等等
文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

下面这些标签可用在 head 部分:<base>, <link>, <meta>, <script>, <style>, <title>

<title>

<title> 定义文档的标题,它是 head 部分中唯一必需的元素

<html><head><title>我的第一个HTML页面</title></head><body><p>body 元素的内容会显示在浏览器中。</p><p>title 元素的内容会显示在浏览器的标题栏中。</p></body></html>
로그인 후 복사
로그인 후 복사

浏览器会以特殊的方式来使用标题,并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样,当把文档加入用户的链接列表或者收藏夹或书签列表时,标题将成为该文档链接的默认名称。

<base>

<base>标签为页面上的所有链接规定默认地址或默认目标。

通常情况下,浏览器会从当前文档的URL中提取相应的元素来填写相对URL中的空白。
使用<base>标签可以改变这一点。浏览器随后将不再使用当前文档的URL,而使用指定的基本URL来解析所有的相对URL。这其中包括 <a><img><link><form>标签中的 URL。

<html><head><base href="http://www.w3school.com.cn/i/" /><base target="_blank" /></head><body><img src="eg_smile.gif" /><br /><p>图像的地址为相对地址。由于我们已经在 head 部分规定了一个基准 URL,浏览器将在如下地址寻找图片:</p><p>"http://www.w3school.com.cn/i/eg_smile.gif"</p><br /><br /><p><a href="http://www.w3school.com.cn">W3School</a></p><p>请注意,链接会在新窗口中打开,即使链接中没有 target="_blank" 属性。这是因为 base 元素的 target 属性已经被设置为 "_blank" 了。</p></body></html>
로그인 후 복사
로그인 후 복사

<base>必需的属性:href

href,值为URL,规定页面中所有相对链接的基准URL。

<base>可选的属性:target

target,值为_blank、_parent、_self、_top、framename等,表明在何处打开页面中所有的链接。比如”_blank”意为在新窗口中打开。

<meta>

<meta>元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。元数据总是以“名称/值”的形式被成对传递的。

<meta>标签位于文档的头部,不包含任何内容。<meta>标签的属性定义了与文档相关联的“名称/值”对。

<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta name="author"content="w3school.com.cn"><meta name="revised"content="David Yang,8/1/07"><meta name="generator"content="Dreamweaver 8.0en"></head>
로그인 후 복사
로그인 후 복사

<meta>必需的属性:content

content,值为一些文本,定义了与http-equiv或name属性相关的元信息。元数据总是以名称/值的形式被成对传递的。

eg:

<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1">
로그인 후 복사
로그인 후 복사

<meta><head> 태그는 모든 헤드 요소의 컨테이너인 문서의 헤드를 정의하는 데 사용됩니다. <head>의 요소는 다음을 수행할 수 있습니다.

-
참조 스크립트

- 브라우저에 스타일시트를 찾을 위치를 지시

-

메타 정보 제공

-

기타

문서 헤더는 문서 제목, 웹에서의 위치, 다른 문서와의 관계 등 문서의 다양한 속성과 정보를 설명합니다. 대부분의 문서 헤더에 포함된 데이터는 실제로 독자에게 콘텐츠로 표시되지 않습니다.

헤드 섹션에는 다음 태그를 사용할 수 있습니다:

<base>, <link>, <meta>, <스크립트>, <스타일>, <제목>.

<title>

<title>은 문서의 제목을 정의합니다. < span style="text-장식:underline;">head 섹션에서 유일하게 필요한 요소입니다.


<meta http-equiv="charset" content="iso-8859-1"><meta http-equiv="expires" content="31 Dec 2008">
로그인 후 복사
로그인 후 복사

브라우저에서는 제목을 특별한 방식으로 사용하며 일반적으로 브라우저 창의 제목 표시줄이나 상태 표시줄에 제목을 배치합니다. 마찬가지로 사용자의 링크 목록이나 즐겨찾기 또는 책갈피 목록에 문서가 추가되면 제목이 문서 링크의 기본 이름이 됩니다.

<base>

🎜🎜<base> 태그는 페이지의 모든 링크에 대한 기본 주소 또는 기본 대상을 지정합니다. 🎜🎜🎜일반적으로 브라우저는 현재 문서의 URL에서 해당 요소를 추출하여 상대 URL의 공백을 채웁니다. 🎜이를 변경하려면 <base> 태그를 사용하세요. 그러면 브라우저는 더 이상 현재 문서의 URL을 사용하지 않지만 지정된 기본 URL을 사용하여 모든 상대 URL을 확인합니다. 여기에는 <a>, HTML의 <head> 태그와 해당 콘텐츠에 대한 자세한 소개, <link>, <form>이 포함됩니다. 태그의 URL입니다. 🎜
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" /></head>
로그인 후 복사
로그인 후 복사
🎜<base>필수 속성: 🎜href🎜🎜🎜🎜🎜href🎜, 값은 URL이며 페이지에 있는 모든 상대 링크의 기본 URL을 지정합니다. 🎜🎜🎜<base> 선택적 속성: 🎜target🎜🎜🎜🎜🎜target🎜, 값은 _blank, _parent, _self, _top, 프레임 이름 등이며 파일을 열 위치를 나타냅니다. 페이지 모든 링크. 예를 들어 "_blank"는 새 창에서 열기를 의미합니다. 🎜🎜

<meta>

🎜🎜<meta> 요소는 검색 설명 및 키워드와 같은 페이지에 대한 메타 정보를 제공할 수 있습니다. 엔진 및 업데이트 빈도. 메타데이터는 항상 이름/값 쌍으로 전달됩니다. 🎜🎜🎜 <meta> 태그는 문서의 머리 부분에 있으며 내용을 포함하지 않습니다. <meta> 태그의 속성은 문서와 연관된 이름/값 쌍을 정의합니다. 🎜
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta name="description"content="HTML examples"><meta name="keywords"content="HTML, DHTML, CSS, XML, XHTML, JavaScript, VBScript"></head>
로그인 후 복사
로그인 후 복사
🎜<meta>필수 속성: 🎜content🎜🎜🎜🎜🎜content🎜, 값은 http-equiv 또는 name 속성과 관련된 메타 정보를 정의하는 일부 텍스트입니다. 메타데이터는 항상 이름/값 쌍으로 전달됩니다. 🎜🎜🎜예: 🎜
<meta name="keywords" content="HTML,ASP,PHP,SQL">
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜<meta>주요 선택 속성: 🎜http-equiv🎜, 🎜name🎜🎜🎜🎜🎜http-equiv🎜, 값은 콘텐츠 유형, 만료, 새로 고침, 쿠키 설정 등은 콘텐츠 속성을 HTTP 헤더에 연결합니다. 🎜🎜🎜http-equiv 속성은 이름/값 쌍의 이름을 제공합니다. 그리고 실제 문서를 보내기 전에 브라우저로 보내는 메시지 헤더에 "이름/값" 쌍을 포함하도록 서버에 지시합니다. 🎜예: 🎜
<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜Redirect(웹페이지 재배치용): 🎜
<head><link href="shanghai.htm" rel="parent" charset="en" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜설명 키워드: 🎜
<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
🎜🎜🎜name🎜, 값은 작성자, 설명, 키워드, 생성기, 수정됨, 기타 등입니다. 콘텐츠 속성을 이름으로 지정합니다. 🎜🎜🎜HTML이나 XHTML 태그에는 미리 정의된 이름이 할당되지 않습니다. 일반적으로 귀하와 원본 문서의 독자에게 의미 있는 이름을 자유롭게 사용할 수 있습니다. 🎜"키워드"는 자주 사용되는 이름입니다. 문서의 키워드 세트를 정의합니다. 일부 검색 엔진에서는 이러한 키워드를 사용하여 문서가 발견될 때 문서를 분류합니다. 🎜예:🎜
<meta name="keywords" content="HTML,ASP,PHP,SQL">
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

<link>

<link>链接一个外部样式表。属于在HTML中插入CSS样式表的三种方法之一。

<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

<link>的主要属性:hrefreltypecharset

charset,指明被链接文档的字符集,如UTF-8。但是几乎没有主流浏览器支持 link标签的charset 属性

在下面的例子中,charset 属性指示被链接文档是用英文编写的:

<head><link href="shanghai.htm" rel="parent" charset="en" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

href,规定被链接文档的位置(URL)。

这个不解释了。

rel 属性指示被链接的文档是一个样式表。它的属性值只有 “stylesheet” 得到了所有浏览器的支持。其他值只得到了部分地支持。

<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

type 属性规定被链接文档的 MIME 类型。该属性最常见的 MIME 类型是 “text/css”,该类型描述样式表。

<head><link rel="stylesheet" type="text/css" href="theme.css" /></head>
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

<script>

<script> 标签用于定义客户端脚本,比如 JavaScript。

script 元素既可以包含脚本语句,也可以通过 src 属性指向外部脚本文件。
必需的 type 属性规定脚本的 MIME 类型。
JavaScript 的常见应用时图像操作、表单验证以及动态内容更新。

  • 直接包含脚本语句

<html><body><script type="text/javascript">document.write("<h1>Hello World!</h1>")</script> </body></html>
로그인 후 복사
로그인 후 복사
  • 通过 src 属性指向外部脚本文件

<script type="text/javascript" src="myscripts.js"></script>
로그인 후 복사
로그인 후 복사

<script>必需的属性:type

type,规定脚本的 MIME 类型。

对于不支持脚本的浏览器:

<!DOCTYPE html><html><body><script type="text/javascript">document.write("Hello World!")</script><noscript>Sorry, your browser does not support JavaScript!</noscript><p>不支持 JavaScript 的浏览器将显示 noscript 元素中的文本。</p></body></html>
로그인 후 복사
로그인 후 복사

<style>

<style> 标签用于为 HTML 文档定义样式信息。

在HTML中插入CSS样式表的另外两种方法都是通过style完成的——内部样式表、内联样式。只不过内部样式表用的是style标签<style>,内联样式用的是style属性。

  • 内联样式

<p style="color:blue;margin-left:20px">This is a paragraph.</p>
로그인 후 복사
로그인 후 복사
  • 内部样式表

<html><head><style type="text/css">h1 {color: red}p {color: blue}</style></head><body><h1>header 1</h1><p>A paragraph.</p></body></html>
로그인 후 복사
로그인 후 복사

也可以通过“id选择器”和“class选择器”进行:

  • id选择器

<!DOCTYPE html><html><head><style>#liuhaibo{text-align:center;color:red;} </style></head><body><p id="liuhaibo">Hello World!</p><p>This paragraph is not affected by the style.</p></body></html>
로그인 후 복사
로그인 후 복사
  • class选择器

<!DOCTYPE html><html><head><style>.center{text-align:center;}</style></head><body><h1 class="center">标题居中</h1><p class="center">段落居中。</p> </body></html>
로그인 후 복사
로그인 후 복사

你也可以指定特定的HTML元素使用class。
在以下实例中, 所有的 p 元素使用 class=”center” 让该元素的文本居中,而h1则不可以。

<!DOCTYPE html><html><head><style>p.center{text-align:center;}</style></head><body><h1 class="center">This heading will not be affected</h1><p class="center">This paragraph will be center-aligned.</p> </body></html>
로그인 후 복사
로그인 후 복사

<style>必需的属性:type

type,唯一可能的值是“text/css”,规定样式表的 MIME 类型。

也可以通过style标签创建一个没有下划线的链接:

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta http-equiv="Content-Language" content="zh-cn" /></head><body><a href="/example/html/lastpage.html" style="text-decoration:none">这是一个链接!</a></body></html>
로그인 후 복사
로그인 후 복사

Note:只有title标签<title>、script标签<script>和style标签<style>有完整的关闭标签。

위 내용은 HTML의 태그와 해당 콘텐츠에 대한 자세한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿