html代码范例_最佳HTML范例和HTML5范例

最新推荐文章于 2024-04-21 09:49:59 发布

cumi6497

最新推荐文章于 2024-04-21 09:49:59 发布

阅读量4.4k

点赞数

文章标签： html python css javascript java ViewUI

原文链接：https://www.freecodecamp.org/news/html-and-html5-example/

版权

html代码范例

HTML provides the structure of websites. Here are some examples of how to use HTML syntax to build websites, including some examples of newer HTML5 features.

HTML提供了网站的结构。以下是一些如何使用HTML语法来构建网站的示例，包括一些更新HTML5功能的示例。

A Href属性示例 (The A Href Attribute Example)

The <a href> attribute refers to a destination provided by a link. The a (anchor) tag is dead without the <href> attribute. Sometimes in your workflow, you don’t want a live link or you won’t know the link destination yet. In this case, it’s useful to set the href attribute to "#" to create a dead link. The hrefattribute can be used to link to local files or files on the internet.

<a href>属性是指链接提供的目标。没有<href>属性的a (锚定)标记<href> 。有时在您的工作流程中，您不需要实时链接，或者您尚不知道链接目标。在这种情况下，将href属性设置为"#"以创建无效链接很有用。 href属性可用于链接到本地文件或Internet上的文件。

For instance:

例如：

<html>
  <head>
    <title>Href Attribute Example</title>
  </head>
  <body>
    <h1>Href Attribute Example</h1>
      <p>
        <a href="https://www.freecodecamp.org/contribute/">The freeCodeCamp Contribution Page</a> shows you how and where you can contribute to freeCodeCamp's community and growth.
      </p>
    </h1>
  </body>
</html>

The <a href> attribute is supported by all browsers.

所有浏览器都支持<a href>属性。

更多属性： (More attributes:)

hreflang : Specifies the language of the linked resource. target : Specifies the context in which the linked resource will open. title : Defines the title of a link, which appears to the user as a tooltip.

hreflang ：指定链接资源的语言。 target ：指定链接资源将在其中打开的上下文。 title ：定义链接的标题，它在用户面前显示为工具提示。

例子 (Examples)

<a href="#">This is a dead link</a>
<a href="https://www.freecodecamp.org">This is a live link to freeCodeCamp</a>
<a href="https://html.com/attributes/a-href/">more with a href attribute</a>

页内锚 (In-page anchors)

It’s also possible to set an anchor to certain place of the page. To do this you should first place a tab at location on the page with tag and necessary attribute “name” with any keyword description in it, like this:

也可以在页面的特定位置设置锚点。为此，您应该首先在页面上的位置放置一个标签，其中包含标签和必要的属性“名称”，并在其中包含任何关键字描述，如下所示：

<a name="top"></a>

Any description between tags is not required. After that you can place a link leading to this anchor at any palce on same page. To do this you should use tag with necessary attribute “href” with symbol # (sharp) and key-word description of the anchor, like this:

标签之间不需要任何描述。之后，您可以在该页面的任意位置放置一个指向该锚点的链接。为此，您应该使用带有必要属性“ href”的标记，标记为＃(尖锐)和锚点的关键字描述，如下所示：

<a href="#top">Go to Top</a>

图片链接 (Image Links)

The <a href="#"> may also be applied to images and other HTML elements.

<a href="#">也可以应用于图像和其他HTML元素。

例 (Example)

<a href="#"><img itemprop="image" style="height: 90px;" src="http://www.chatbot.chat/assets/images/header-bg_y.jpg" alt="picture">  </a>

例 (Example)

href的更多示例 (Some more examples of href)

<base href="https://www.freecodecamp.org/a-href/">This gives a base url for all further urls on the page</a>
<link href="style.css">This is a live link to an external stylesheet</a>

目标实例 (The A Target Example)

The <a target> attribute specifies where to open the linked document in an a (anchor) tag.

的<a target>属性指定在何处打开在所链接的文档a (锚)标签。

Examples:

例子：

A target attribute with the value of “_blank” opens the linked document in a new window or tab.

值为“ _blank”的目标属性会在新窗口或选项卡中打开链接的文档。

<a href="https://www.freecodecamp.org" target="_blank">freeCodeCamp</a>

A target attribute with the value of “_self” opens the linked document in the same frame as it was clicked (this is the default and usually does not need to be specified).

值为“ _self”的目标属性会在单击链接的同一帧中打开链接的文档(这是默认设置，通常无需指定)。

<a href="https://www.freecodecamp.org" target="_self">freeCodeCamp</a>

<a href="https://www.freecodecamp.org">freeCodeCamp</a>

A target attribute with the value of “_parent” opens the linked document in the parent frame.

值为“ _parent”的目标属性将在父框架中打开链接的文档。

<a href="https://www.freecodecamp.org" target="_parent">freeCodeCamp</a>

A target attribute with the value of “_top” opens the linked document in the full body of the window.

值为“ _top”的目标属性将在窗口的整个正文中打开链接的文档。

<a href="https://www.freecodecamp.org" target="_top">freeCodeCamp</a>

A target attribute with the value of “framename” Opens the linked document in a specified named frame.

值为“ framename”的目标属性在指定的命名框架中打开链接的文档。

<a href="https://www.freecodecamp.org" target="framename">freeCodeCamp</a>

身体背景属性示例 (The Body Background Attribute Example)

If you want to add a background image instead of a color, one solution is the <body background> attribute. It specifies a background image for an HTML document.

如果要添加背景图像而不是颜色，则一种解决方案是<body background>属性。它为HTML文档指定背景图片。

Syntax:

句法：

<body background="URL">

Attribute:

属性：

background - URL for background image

Example:

例：

<html>
  <body background="https://assets.digitalocean.com/blog/static/hacktoberfest-is-back/hero.png">
  </body>
</html>

身体背景属性已贬值 (body-background attribute is depreciated)

the body-background attribute been deprecated in HTML5. The correct way to style the <body> tag is with CSS.

在HTML5中不推荐使用body-background属性。设置<body>标签样式的正确方法是使用CSS。

There are several CSS properties used for setting the background of an element. These can be used on to set the background of an entire page.

有几个CSS属性用于设置元素的背景。这些可用于设置整个页面的背景。

身体Bgcolor属性示例 (The Body Bgcolor Attribute Example)

The <body bgcolor> attribute assigns a background color for an HTML document.

<body bgcolor>属性为HTML文档分配背景色。

Syntax:

语法：

<body bgcolor="color"> The color value can be either a color name (like, purple) or a hex value (like, #af0000).

<body bgcolor="color">颜色值可以是颜色名称(如purple )或十六进制值(如#af0000 )。

To add a background color to a webpage you can use the <body bgcolor="######"> attribute. It specifies a color for the HTML document to display.

要为网页添加背景色，可以使用<body bgcolor="######">属性。它指定HTML文档显示的颜色。

For example:

例如：

<html>
  <head>
    <title>Body bgcolor Attribute example</title>
  </head>
  <body bgcolor="#afafaf">
    <h1>This webpage has colored background.</h1>
  </body>
</html>

You can change the color by replacing ###### with a hexadecimal value. For simple colors you can also use the word, such as “red” or “black”.

您可以通过将######替换为十六进制值来更改颜色。对于简单的颜色，您也可以使用单词，例如“红色”或“黑色”。

All major browsers support the <body bgcolor> attribute.

所有主要的浏览器都支持<body bgcolor>属性。

Note:

注意：

HTML 5 does not support the <body bgcolor> attribute. Use CSS for this purpose. How? By using the following code: <body style="background-color: color"> Of course, you can also do it in a separate document instead of an inline method.
HTML 5不支持<body bgcolor>属性。为此使用CSS。怎么样？通过使用以下代码： <body style="background-color: color">当然，您也可以在单独的文档中代替内联方法来完成此操作。
Do not use RGB value in <body bgcolor> attribute because rgb() is for CSS only, that is, it will not work in HTML.
不要在<body bgcolor>属性中使用RGB值，因为rgb()仅适用于CSS，也就是说，它不适用于HTML。

Div Align属性示例 (The Div Align Attribute Example)

The <div align=""> attribute is used for aligning the text in a div tag to The Left, Right, center or justify.

<div align="">属性用于将div标记中的文本对齐到“左”，“右”，“居中”或“对齐”。

For instance:

例如：

<html>
<head>
<title> Div Align Attribbute </title>
</head>
<body>
<div align="left">
Lorem ipsum dolor sit amet, consectetur a

最低0.47元/天解锁文章

cumi6497

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
html代码范例_最佳HTML范例和HTML5范例

html代码范例HTML provides the structure of websites. Here are some examples of how to use HTML syntax to build websites, including some examples of newer HTML5 features. HTML提供了网站的结构。以下是一些如何使用HTML语法来构建网站...
复制链接

扫一扫