html下拉列表不居中_HTML介绍——入门级

最新推荐文章于 2024-05-03 22:42:26 发布
最新推荐文章于 2024-05-03 22:42:26 发布
阅读量104 收藏
点赞数
文章标签： html下拉列表不居中

1.1 HTML简介

什么是HTML?

HTML 是用来描述网页的一种语言。

l HTML 指的是超文本标记语言: Hyper Text Markup Language

l HTML 不是一种编程语言，而是一种标记语言

l 标记语言是一套标记标签 (markup tag)

l HTML 使用标记标签来描述网页

l HTML 文档包含了HTML 标签及文本内容

l HTML文档也叫做 web 页面

实例

我的第一个标题

我的第一个段落。

实例解析

l DOCTYPE 声明了文档类型

l 位于标签 与 描述了文档类型

l 位于标签

与 为可视化网页内容

l 位于标签

与

作为一个标题使用

l 位于标签

与

作为一个段落显示

在HTML5中也是描述了文档类型。

1.1.3 HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

l HTML 标签是由尖括号包围的关键词，比如

l HTML 标签通常是成对出现的，比如 和

l 标签对中的第一个标签是开始标签，第二个标签是结束标签“/”

l 开始和结束标签也被称为开放标签和闭合标签

内容标签>

1.1.4 HTML 元素

"HTML 标签" and "HTML 元素" 通常都是描述同样的意思.

但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签，如下实例:

HTML 元素:

This is a paragraph.

1.1.5 Web 浏览器

Web浏览器(如谷歌浏览器，Internet Explorer，Firefox，Safari，Chrome)是用于读取HTML文件，并将其作为网页显示。

浏览器并不是直接显示的HTML标签，但可以使用标签来决定如何展现HTML页面的内容给用户：

a79c967daaef906825d876c0ffea3820.png

1.1.6 HTML 网页结构

下面是一个可视化的HTML页面结构：

fe9c0705cfc01ee27b0c28b2736aa923.png

1.1.7 HTML版本

从初期的网络诞生后，已经出现了许多HTML版本:

ce214f579654be377385c50bf876538f.png

1.1.8 声明

声明有助于浏览器中正确显示网页。

网络上有很多不同的文件，如果能够正确声明HTML的版本，浏览器就能正确显示网页内容。

doctype 声明是不区分大小写的，以下方式均可：

常见的 DOCTYPE 声明

u HTML 5

u HTML 4.01 Strict

这个 DTD 包含所有 HTML 元素和属性，但不包括表象或过时的元素(如 font )。框架集是不允许的。

u HTML 4.01 Transitional

这个 DTD 包含所有 HTML 元素和属性，包括表象或过时的元素(如 font )。框架集是不允许的。

u HTML 4.01 Frameset

这个 DTD 与 HTML 4.01 Transitional 相同，但是允许使用框架集内容。

u XHTML 1.0 Strict

这个 DTD 包含所有 HTML 元素和属性，但不包括表象或过时的元素(如 font )。框架集是不允许的。结构必须按标准格式的 XML 进行书写。

u XHTML 1.0 Transitional

这个 DTD 包含所有 HTML 元素和属性，包括表象或过时的元素(如 font )。框架集是不允许的。结构必须按标准格式的 XML 进行书写。

u XHTML 1.0 Frameset

这个 DTD 与 XHTML 1.0 Transitional 相同，但是允许使用框架集内容。

u XHTML 1.1

这个 DTD 与 XHTML 1.0 Strict 相同，但是允许添加模块(例如为东亚语言提供 ruby 支持)。

1.2HTML基础

1.2.1 标题

HTML 标题(Heading)是通过

-

标签来定义的.

h是英文header标题的缩写，标题无处不在，它的应用范围十分广泛：网站结构、写作文、PPT等。h1是主标题，h2是副标题，h3、h4、h5、h6依次递减字体的大小。

实例：

defaefc5764ecf652b1cc24b179843f6.png

1.2.2 段落

HTML 段落是通过标签

来定义的，P是英文paragraph段落的缩写，经常被用来创建一个段落，就和你写作文一样。

ff1d4d949202ac0693abcfb8a3670fb1.png

1.2.3 链接

HTML 链接是通过标签 来定义的.a标签，也叫anchor(锚点)元素，既可以用来链接到外部地址实现页面跳转功能，也可以链接到当前页面的某部分实现内部导航功能。在 href 属性中指定链接的地址。

465d4452c432e7599fb405b0254b9207.png

使用target属性,可以定义被链接的文档在何处打开，target=“_blank”会在新窗口打开文档。

这是一个链接！

标签定义 HTML 页面中的主题变化(比如话题的转移)，并显示为一条水平线。

1.2.4 折行


元素是一个空的 HTML 元素。由于关闭标签没有任何意义，因此它没有结束标签。

e55149ffc74000e9812c6c47a952705b.png

文本格式化

HTML 使用标签 与 对输出的文本进行格式, 如：粗体 or 斜体

通常标签 替换加粗标签 来使用, 替换 标签使用。

a158feaa1c311b256c0459e71302ebb2.png

1.2.5 表格

表格由

标签定义)。字母 td 指表格数据(table data)，即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

如果不定义边框属性，表格将不显示边框。有时这很有用，但是大多数时候，我们希望显示边框。

使用边框属性来显示一个带有边框的表格：

4c044cddea4d56e76d5d92b3c352fc81.png

表格的表头使用th标签进行定义。

大多数浏览器会把表头显示为粗体居中的文本：

f54c21ac98a174440b9258d00934d0d6.png

行合并和列合并:

fe2fcf85a342f959cae9d75acaef1592.png

1.2.6 列表

HTML 支持有序、无序和定义列表:

有序列表也是一列项目，列表项目使用数字进行标记。 有序列表始于

  1. 标签。每个列表项始于
  2. 标签。

    列表项项使用数字来标记。

    d2112d9c3e841e4b3a74c8f6ee45ba8a.png

    观察在ol添加type属性，type=”A”或者type=”a”或者type=”i”或者type=”I”

    无序列表是一个项目的列表，此列项目使用粗体圆点(典型的小黑圆圈)进行标记。

    无序列表使用

  3. 标签。
    21d8e1f5e48952e2a61d10cd40dad5e0.png

    自定义列表不仅仅是一列项目，而是项目及其注释的组合。

    自定义列表以

    开始。每个自定义列表项的定义以
    开始。
    799dbe1edcebe64e6721dddfc8ea94c7.png

    1.2.10区块

    HTML 可以通过

    和 将元素组合起来。

    Ø 区块元素

    大多数 HTML 元素被定义为块级元素或内联元素。

    块级元素在浏览器显示时，通常会以新行来开始(和结束)。

    实例:

    ,

    ,

    • ,

    Ø 内联元素

    内联元素在显示时通常不会以新行开始。

    实例: ,

, ,

Ø

元素

HTML

元素是块级元素，它是可用于组合其他 HTML 元素的容器。
元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

如果与 CSS 一同使用，

元素可用于对大的内容块设置样式属性。
元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用

1.2.11布局

大多数网站可以使用

或者
08545d8b5ac6e6393349d2d029ba33b2.png

1.2.12 表单

表单是一个包含表单元素的区域。

表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。

表单使用表单标签

来设置:
b995201340df2b83459163ccb8e3991c.png

文本域(Text Fields)

文本域通过 标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域。

d7924e0443107cc9a8ec161a5ebd1ffe.png

密码字段

密码字段通过标签 来定义:

ee42a8072d6493c829b5630c09c3bd76.png

单选按钮(Radio Buttons)

标签定义了表单单选框选项:

e6141ad4002f529e850d589272c89fd2.png

复选框(Checkbox)

定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。

3ab3e9e109864ef3de06dc643e15e510.png

提交按钮(Submit Button)

定义了提交按钮.

当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

63e282a8512f588ff09e32569ddd1cb4.png

下拉列表

503bf94bc988c9f1a3221296cabe0706.png

文本框

c3d0c1bc0c789848f0910fcad7f618f3.png

按钮

95a28d08e5b89f383066b0176bf4b53d.png

1.2.13 head头部

可以添加在头部区域的元素标签为:

,
weixin_39594312
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML笔记——千锋Ghost老师_2019前端入门
http____的博客
11-30 851
B站千锋教育了解 VSCode 编辑器HTML基本结构和属性初始代码HTML注释标题与段落文本修饰标签图片标签与图片属性引入文件的地址路径跳转链接跳转锚点特殊符号列表标签表格表单表格表单组合div 与 span 了解 VSCode 编辑器 Shift + Alt + ↓：快速复制该行内容到下一行 Alt + ↑或↓：将该行内容快速移动一行 Tab键：向后缩进 Tab + Shift：向前缩进 多光标：Alt + 鼠标左键 将光标快速移动到行首/行尾：Home/End，在笔记本上这两个键和方向键为同一个键，
HTML入门
qq_54556698的博客
11-22 2416
HTML是一种标记语言，用来组织页面，使用元素和属性。这个元素的主要部分有：元素（Element）：开始标签、结束标签与内容相结合，便是一个完整的元素。开始标签（Opening tag）：包含元素的名称（本例为 p），被左、右角括号所包围。表示元素从这里开始或者开始起作用 —— 在本例中即段落由此开始。结束标签（Closing tag）：与开始标签相似，只是其在元素名之前包含了一个斜杠。这表示着元素的结尾 —— 在本例中即段落在此结束。初学者常常会犯忘记包含结束标签的错误，这可能会产生一些奇怪的结果。
前端基础学习——HTML入门详解
jyn15159的博客
09-21 567
HTML 1.常见浏览器内核 浏览器内核，英文叫做：Rendering Engine，中文翻译很多，排版引擎、解释引擎、渲染引擎，现在流行称为浏览器内核。 浏览器内核包括两部分，渲染引擎和js引擎。 渲染引擎负责读取网页内容，整理讯息，计算网页的显示方式并显示页面。 js引擎是解析执行js，获取网页的动态效果。 后来 JS 引擎越来越独立，内核就倾向于只指渲染引擎。 现在的主流行浏览器： 浏览器 内核 备注 IE Trident IE、猎豹安全、360极速浏览器、百度浏览器
javaEE -11（ 12000 字 HTML4 入门级教程）
weixin_73232539的博客
10-30 1705
12000 字 HTML4 入门级教程
前端基础（HTML）——html介绍 & 常用标签 & 几个案例
Arya的博客，专注后端领域
05-25 945
1.html骨架，html常见标签； 2.表单的提交form，超链接，图片； 3.iframe框架标签，可以作为内嵌窗口；
JavaWeb_HTML入门篇
m0_46613077的博客
07-17 237
JavaWeb_HTML入门篇 本文主要通过对HTML简单的一些知识点的总结等，能够对HTML进行入门级的认识与了解。 本篇是一篇小结篇，主要用于在之后的实践开发过程中能够快速参考一些常用、基础的标签以及用法。 文章目录JavaWeb_HTML入门篇1. HTML初识&&初知1.1 基础概念1.2 快速入门1.3标签学习1.4 元素1.5 特殊字符1.6 属性1.7 表单2.小结 1. HTML初识&&初知 1.1 基础概念 * Hyper Text Markup
HTML基础——常用标签汇总
moneyhu的博客
04-27 1665
本节笔记结合黑马程序员视频学习，结合案例总结了常见标签(排版、文本格式化、媒体、链接、列表、表格、表单标签)及其使用方法。
JAVA—— HTML
weixin_50594210的博客
09-20 1991
文章目录1 HTML入门1.1 初识HTML1.1.1 概述1.1.2 HTML的组成1）标签2）属性1.2 入门案例1.2.1 初始页面1）创建一个标准的初始化页面2）页面说明1.2.2 案例实现1.3 总结2 基本语法2.1 **关于注释**2.2 关于标签2.2.1 空元素2.2.2 嵌套元素2.2.3 块级和行内1）概念2）div和span2.3 关于属性2.4 特殊字符2.5 总结3 HTML案例-新闻文本3.1 案例效果3.2 案例分析3.2.1 div样式布局3.2.2 文本标签3.3 使用标
【Web前端入门】HTML+CSS 万字总结——带你深入学习掌握
专注于dreamweaver网页设计制作
05-03 9
万维网W3C标准中网页分为结构，表现和行为三部分，HTML用于描述页面的结构，CSS用于控制页面中的元素样式，JavaScript用于响应用户的操作。HTML，CSS和JavaScript组成了前端技术栈。学习HTML就是学习标签的一个过程，难度指数低，重在反复练习！
Android TextView显示HTML 图片居中且不缩放
12-26
Android TextView可以支持简单的... 1、图片不能居中显示 2、图片的大小被缩小 3、图片是在ImageGetter中获取，ImageGetter不能和ImageSpan同时使用； 笔者通过参考大量资料和源码，解决了上述3个问题。
如何让你的html button本身居中的实现
01-21
如何让你的html button本身居中呢？ 这个很好找思路， 在其父标签中设置居中属性啊， 如下： <html> <body> <center><button onClick=myClick()>hit me</button> [removed] function ...
html图片居中图片列表左右切换可放大展示特效
12-07
在网页设计中，实现"html图片居中图片列表左右切换可放大展示特效"是一种常见的功能需求，主要用于增强用户体验，使用户能更直观地查看和交互图片。以下将详细讲解这个功能涉及的关键知识点。 1. HTML 结构：首先，...
从入门到精通HTML5——PDF——网盘链接
02-27
　3.3.5 居中对齐标记——center 54 　3.3.6 向右缩进标记——blockquote 55 　3.4 水平线标记 56 　3.4.1 添加水平线——hr 56 　3.4.2 设置水平线的宽度与高度 　——width、height 57 　3.4.3 设置水平线的颜色...
Office高级应用_Word应用_论文排版7——题注.pdf
07-11
以下将详细介绍如何插入和管理题注，以及如何创建交叉引用。 ### 1. 插入题注 题注是用于标记和引用文档中特定对象（如图表、图片或公式）的自动编号标签。在Word中，插入题注分为自动插入和手动插入两种方式： #...
pi_heif-0.17.0-cp310-cp310-manylinux_2_17_aarch64.whl
07-27
pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。pip install 直接安装，无需再下载，直接用。
Numper基础（一）
07-27
Numper基础（一）
C语言写的潮流计算大作业代码.zip
最新发布
07-27
c写的潮流计算大作业代码.zipc写的潮流计算大作业代码.zipc写的潮流计算大作业代码.zip
关于大模型的教程、调用和使用技巧的资源，帮助更多人高效地认知和使用大模型.docx
07-27
大模型（Large Models），尤其是指预训练的大规模语言模型，在自然语言处理（NLP）、计算机视觉（CV）等领域取得了显著的进步。以下是一些关于大模型的教程、调用和使用技巧的资源，帮助更多人高效地认知和使用大模型： 1. 大模型教程资源 官方文档： 大多数大型模型都会在其官方网站或GitHub页面上发布详细的文档，包括模型介绍、安装指南、使用示例等。 例如，Hugging Face的Transformers库提供了丰富的文档和教程。 在线课程： Coursera、edX等在线教育平台上提供了关于大模型的课程。 例如，斯坦福大学的NLP课程通常会涵盖最新的大模型技术。 博客文章： Medium、Towards Data Science等平台上有很多关于大模型的文章，这些文章通常由专业人士撰写，包含实战经验和技巧。 视频教程： B站（bilibili.com）和YouTube上有很多关于大模型的教程视频，适合初学者入门。 2. 调用API和使用技巧 Hugging Face Transformers： 提供了多种预训练模型的加载和调用方式。 Hugging Face文档 是一个非常
latex设置一级标题样式不居中_Markdown不快速入门
06-02
对于 LaTeX 设置一级标题样式不居中，可以使用 titlesec 宏包来实现。具体步骤如下： 1. 在导言区引入宏包。 ``` \usepackage{titlesec} ``` 2. 使用 \titleformat 命令设置一级标题样式。 ``` \titleformat{\...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值