type
status
date
slug
summary
tags
category
icon
password
Email
HTML初识
HTML全称是:
Hyper Text Markup Language
HTML不是一种编程语言,而是一种
标记语言
,使用标记标签来描述网页。HTML标签是由
<>
包围起来的关键词,并且通常是成对出现的,例如<p> </p>
,被称为开始标签(开放标签)和结束标签(闭合标签)HTML文档就等同于网页,因为HTML文档包含
HTML标签
和纯文本
,HTML文档也被称之为标签。浏览器会使用标签来解释网页的内容。第一个HTML程序
HTML标题:使用 <h1> ..... <h6> 等作为不同的等级
HTML段落:使用<p>标签进行定义
HTML链接:使用<a href="xxxx">来表示,href表示链接的地址
HTML显示图像:使用<img src="xxx" width="xx" height="xxx">来显示
HTML元素
指的是开始标签和结束标签之间的内容。
<p>元素:元素的内容是:这是一个段落
<body>元素:定义了html文档的主体,元素的内容是另一个HTML标签
<html>元素:定义了整个html文档。
省略结束标签虽然可以但是不要这么做
标签尽量使用小写。
HTML属性
属性为元素提供附加信息,属性总是在开始标签中定义。
href就是在<p>中指定的一个属性
align属性:为标题设置对齐方式
主标题
bgcolor属性:在<body>中指定,设置网页的背景颜色
<body bgcolor="yellow">
属性值应该始终被包括在引号内,单引号和双引号都可以。
HTML标题
HTML有六种不同的标题,分别对应<h1> 到 <h6>
HTML水平线:<hr />
HTML段落
如果你想要插入一个空行:这是一个空的html元素,因此没有结束标签
在不产生新段落的情况下换行:
不要用没有结束标签的HTML元素,因此要使用
<br />
而不是<br >
HTML样式
style
属性:提供了一种可以改变所有HTML元素样式的通用方法。使用样式替代我们刚才的
center align bgcolor
等标签或者属性(废弃)设置背景颜色:
background-color
设置字体颜色和尺寸:
文本对齐:
格式化标签
文本格式化
定义粗体文本
定义大号字体
着重字
斜体字
加重语气
这是下标字
这是上标字
这是删除字
下划线
引用等:
我的名字
我的网站是欢迎大家来逛逛尽情期待吧这是长的引用
这是短引用定义项目
输出等标签::
预格式文本 保留了空行和换行
6666
很适合用来显示代码
for (int i=1;i<=100;i++){
sum+=i;
}
计算机编程代码:
HTML引用
短引用:<q>
我们的目标是:构建和谐社会,构建人类命运共同体。
长引用:<blockquote>
我想说的是:
我的网站啊啊啊啊,快点来访问我的网站! 啊啊啊啊
使用缩略词:<abbr>
用于定义的引用:<dfn>
用于显示地址:<address>
用于著作标题:<cite>
用于双向重写:<bdo>
HTML注释
条件注释等
一个锚的提示功能(看下文)
HTML+CSS
在html中定义样式表
外部样式表:
内部样式表:
内联样式
HTML链接
使用<a href="url"> 即可访问指定的url链接
设置target属性可以控制行为
命名锚:name属性可以规定锚的名称,这相当于一个书签,当我们定义了一个锚后,在之后我们可以直接跳转到这个锚点。
点击可以看到效果:
HTML图片
使用<img>标签来指定src图片的url链接
使用
alt
来替换文本的属性当图片无法显示的时候,会显示指定的文本
嵌套将图片作为超链接
HTML表格
<table>
表示接下来是一个表格;<tr>
表示每一行;<td>
表示分割成的每一列添加
<border>
属性来表示表格是否含有边框使用
<th>
来表示列表的表头Heading 1 | Heading 2 |
row 1,col 1 | row 1,col 2 |
row 2,col 1 | row 2,col 2 |
HTML列表
无序列表
<ul>
用来指定无序列表,<li>
用来指定列表的每一项- Coffee
- Cola
- Milk
有序列表
<ol>
用来创建有序列表1. Coffee
2. Cola
3. Milk
自定义列表项
<dl>
指定自定义列表项的开始;<dt>
表示每一个列表项;<dd>
表示每一个列表项的定义HTML块
HTML的元素分为块元素和内联元素。
块元素可以自动换行,内联元素不会自动换行
设置块元素:
- 111111
- 222222
- 333333
- 111111
- 222222
- 333333
设置内联元素:
<span>
- 作者:Yuleo
- 链接:https://www.helloylh.com/article/html1
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议,转载请注明出处。