html学习笔记(一)

html学习笔记(一)

时隔一年,又翻出了html书与视频,从头再来。
这几天回顾了一些常用标签。

1.html是什么?
html又称为超文本标记语言,是一种标识性的语言。它包括一系列标签,通过这些标签可以将网络上的分散的Internet资源连接为一个逻辑整体。html文本石油html命令组成的描述性文本,html命令可以说明文字,图形,绘画,声音,表格,链接等。

2.html使用什么IDE?
目前博主在用的是HBulider X,之前也有用过Sublime Text,但是博主觉得HBulider X更加好用一些。HBulider X相较于Sublime Text更快一些,而且本身较小,下载方便,对代码的补全反应也很快,但有时也会出现卡顿的情况。

3.新建的html文件`


<html>
	<head>
		<meta charset="utf-8">
		<title>title>
	head>
	<body>
	body>
html>

其中在文档的最外层, 文档中的所有文本和html标签都包含在其中,它表示该文档是以超文本标识语专言(HTML)编属写的。

元素是所有头部元素的容器。 内的元素可包含脚本,指示浏览器在何处可以找到样式表,提供元信息,等等。以下标签都可以添加到 head 部分: 、、、、


<html>
	<head>
		<meta charset="utf-8">
		<title>今天很喜欢小水的网页title>
	head>
	<body>
	body>
html>

实现效果如下图
html学习笔记(一)_第1张图片
4.几个简单标签。(以下标签均写在中)
(1).标题标签


<html>
	<head>
		<meta charset="utf-8">
		<title>今天很喜欢小水的网页title>
	head>
	<body>
	<h1>标题1h1>
	<h2>标题2h2>
	<h3>标题3h3>
	<h4>标题4h4>
	body>
html>

实现效果
html学习笔记(一)_第2张图片
(2).段落标签

在这里插入图片描述
(3).a标签

<html>
	<head>
		<meta charset="utf-8">
		<title>今天很喜欢小水的网页title>
	head>
	<body>
		<a href="https://i.csdn.net/#/uc/profile">跳转链接a>
	<p>今天真是美好的一天呢。p>
	<p>祖国是哺育我们的母亲,是生命的摇篮,是每一个中国人的骄傲,在庆祝您62周年华诞之际,我热血沸腾,思绪澎湃。每当我们仰望五星红旗,每一次唱起国歌,爱国之情就在我们心中激荡。p>
	body>
html>

实现效果
html学习笔记(一)_第3张图片
其中 href 属性引bai号中写链接的地址,两个尖括号之间为网页上要点击链接的字符。
(4).标签
图片和HTML文本在同一目录下:直接选中图片,添加到scr中
例如:
在这里插入图片描述
代码实现`

		<img src="1.gif" >

实现效果
html学习笔记(一)_第4张图片
(5).列表标签
ul>li无序列表
代码实现

<ul>
			<li>无序列表1li>
			<li>无序列表2li>
			<li>无序列表3li>
			<li>无序列表4li>
			<li>无序列表5li>
		ul>

效果

html学习笔记(一)_第5张图片
有序列表

代码实现

		<ol>
			<li>有序列表li>
			<li>有序列表li>
			<li>有序列表li>
			<li>有序列表li>
			<li>有序列表li>
		ol>

实现效果
html学习笔记(一)_第6张图片

over

你可能感兴趣的:(html,html5)