粗谈HTML基础结构与布局

HTML

大家好,今天给大家推出的是一篇技术贴——关于HTML基础结构与布局的小秘密,希望大家能够有所收获(๑•̀ㅂ•́)و✧

1

HTML的基本结构:

引用脚本、指示浏览器在哪里找到样式表、提供元信息

网页显示区域(一般要实现的代码都在这里写)

(开头和结尾成对出现,双标签)

2

HTML的格式标签

3

.链接:

This is a link

实例:本文本 是一个指向本网站中的一个页面的链接。本文本 是一个指向非本网站中的一个页面的链接

4

图像:

5

换行:

6

文本框:

用 于搜索用户信息

根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以

是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

7

表单

!DOCTYPE html>

First name:

Last name:

如果您点击提交,表单数据会被发送到名为 demo_form.asp 的页面。

表单实例

Volvo

Saab

Fiat

Audi

8

框架:

标签定义 frameset 中的一个特定的窗口(框架)。

实例

9

背景图像

图像背景

gif 和 jpg 文件均可用作 HTML 背景。

如果图像小于页面,图像会进行重复。

10

表格

11

无序列表和有序列表

(1)无序列表始于

标签。每个列表项始于

Coffee

Milk

(2)有序列表始于 标签。每个列表项始于

标签。

Coffee

Milk

实例:一个嵌套列表

一个嵌套列表:

咖啡

红茶

绿茶

中国茶

非洲茶

牛奶

div和span

共同点:

可以通过

和 将 HTML 元素组合起来。 可以作为一个容器

不同点:

1.

元素是块级元素,浏览器会在其前后显示折行。与 CSS 一同使用,

元素可用于对大的内容块设置样式属性。

2. 元素是内联元素,可用作文本的容器。与 CSS 一同使用时, 元素可用于为部分文本设置样式属性。

到这里,这次对于HTML基础结构和布局也介绍完了~ 你有没有从中学到什么东西呢?小编很期待和大家的讨论呢!

文案:赵瑞瑞

排版:丁丽娟

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180803B1W1K700?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券