HTML基本语法总结-适合初学者

最新推荐文章于 2024-08-16 22:57:43 发布

cnjy的博客

最新推荐文章于 2024-08-16 22:57:43 发布

阅读量518

点赞数

分类专栏： html 文章标签： html web前端

本文链接：https://blog.csdn.net/cnjy_/article/details/76222315

版权

html 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML是什么？

HTML(HyperText Markup Language)：超文本标记语言，官方是这么说的，哈哈，其实就我个人的理解html就是定义页面结构的，更直接的说就跟画画一样，在画画之前先把轮廓画出来，html就是负责画轮廓的，真正实现样式是CSS的事，在这里写点的东西希望可以帮到大家，如有不对的地方，希望大家多多指教。

需要准备什么？

那么接下来就说说要准备些什么东西呢？肯定是要准备一个编辑器来编写代码啦！编写html的编辑器有很多，比如：sublime、notepadd++、Dreamweaver、editplus、webstorm，hbuilder、记事本也是可以的，本人用的是sublime，其实无论用哪一个编辑器都是一样的，初学者一开始不用太过纠结用哪个编辑器，因为初学嘛，就是打基础的，不需要很智能，很智能就不方便练手啦，哈哈，说的有点多。

代码怎么写？

刚开始接触代码的时候，很多人应该会很迷茫，不知道从何处下手，那些编辑器如何使用的我就不说啦，言归正传，看下图

由上图我们可以看到，HTML由文档声明“<!doctype html>”（大小写都可以）、html标签、head标签、body标签组成，具体位置看上图就可以了，title里是写网页标题的，body里写内容，由上面的的代码在浏览器中就可以显示出hello world！了。

学会了html格式，下面我们来介绍html标签：

html标签都是闭合的，分双标签和单标签，总结一下常用的单闭合标签：

<br /> 换行

<hr /> 水平分割线

<area /> 文本域

<img /> 图片

<input /> 输入控件

<link /> 链接

html颜色值设置的三种方法：

1、直接用英语单词 red、orange、yellow、green、cyan、blue、purple、gray、white、black

2、rgb(0~255,0~255,0~255)

3、十六进制 #ccc、#eee等等

html常见字符实体：

空格  

< 小于号 <

> 大于号 >

& 和号 &

" 引号 "

￥人民币 ¥

® 注册商标 ®

x 乘号 ×

÷ 除号 ÷

html注释：

HTML大部分标签是有语义的，接下来说说有语义标签：

标题标签 hn

n=1~6，<h1></h1>，从1~6，字体越来越小，一级标题一个网页里只允许出现一次，就像我们在word里写的大标题一样。

段落标签 p

<p></p> 表示段落，在新闻网站中，h与p经常一起出现；

新闻标题一般用h表示，而新闻的每一段内容适合用p标签。

图片标签 img

说一下路径，在比如说在引入图片地址时，图片并不在当前目录的情况：

./ 指当前目录(可省略不写) ../ 指上一级目录 ../../ 指上上一级目录

超链接标签 a

<a href="地址" target="_blank"></a> 新生成窗口

既然说了a标签，就直接把锚点总结在这里：

<a name="锚点的名字"></a> 使用超链接 # 跳转到指定锚点

原样输出标签 pre

<pre></pre> 在HTML里写的是什么格式他就怎么输出

列表标签 ul ol dl

<ul></ul> 无序列表

<ol></ol> 有序列表

<li></li> 列表项

<dl> 自定义列表

<dt></dt> 列表项目的标题

<dd></dd> 列表项目的描述

</dl>

文本标签（双标签）：

em 强调表现为斜体

strong 强调表现为加粗

cite 引证距离/书名/电影名

dfn 定义项目

kbd 键盘按键

abbr 定义缩写配合title

bdo 配合dir属性（ltr，rtl）改变文字书写方向

code 定义代码

var 定义变量

del 已经删除的删除线

ins 当前的下划线

sup 上标文字

sub 下标文字

q 引用短

blockquote 引用长

address 定义地址

b 加粗强调

i 斜体科学专业术语

u 下划线定义与其他文本不同风格的文本

不需要全部记住，记住几个常用的就可以了。

表格标签 table

<table> 表

<tr> 行

<td></td> 列

</tr>

</table>

跨列：<td colspan=" "></td>

跨行：<td rowspan=" "></td>

表单标签 form

属性：input

select

option

textarea

button

fieldset

legend

框架分帧 iframe

常用的图片格式：

jpg/jpeg gif png

好了，到了这里HTML的常用标签全在这里了，其实HTML标签是有自带属性的，不过都不推荐使用，因为样式是css的活，就不要用HTML来实现了，接下来我也会总结css的基础知识，希望大家多多关注，多多交流，共同学习！

cnjy的博客

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML基本语法总结-适合初学者

HTML标签HTML是什么？ HTML(HyperText Markup Language)：超文本标记语言，官方是这么说的，哈哈，其实就我个人的理解html就是定义页面结构的，更直接的说就跟画画一样，在画画之前先把轮廓画出来，html就是负责画轮廓的，这是本人的第一篇博客，可能会有点啰嗦，希望大家不要喷我，哈哈，在这里写点的东西希望可以帮到大家，如有不对的地方，希望大家多多指教。需要准备什么？
复制链接

扫一扫

专栏目录