初学HTML,什么是html

HTML概述

学习Java从HTML开始

HTML是什么

HTML 指的是超文本标记语言 (Hyper Text Markup Language)是用来描述网页的一种语言。

HTML 不是一种编程语言，而是一种标记语言 (markup language)

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

ctrl+1第一标题
ctrl+2第二标题
权重==优先级

html能干什么

工具 HbuilderX
制作网页

HTML基本语法

<!-- 
	注释ctrl+/
	声明html语言版本为html5 告诉浏览器HTML5的标准运行
-->
<!DOCTYPE html>

<!-- 网页中的所有内容必须写在标签内-->
<html>
	<!-- 网页头，可以设置网页内容，添加标题 -->
	<head>

		<!-- 设置网页字符集编码 -->
		<meta charset="utf-8" />

		<!-- 不显示,提供给网页搜索引擎 -->
		<meta name="keywords" content="手机，家电" />
		<meta name="description" content="免费 Web && 编程 教程" />
		<meta name="author" content="Ifan" />

		<!-- 插入网页图标 -->
		<link href="图片.ico" rel="icon" />

		<!-- 网页标题 -->
		<title>我的网页</title>
	</head>
	
	<!-- 
	标签中有多个属性
		属性名="属性值"
		位置:在开始标签中
	 -->
	<body text="blue" bgcolor="black">
		这里面写内容、插图片、插视频
		
		<!-- 
			标签分类:
			<开始>修饰的内容</结束>  成为闭合标签&&双标签
			<link href="img/baidu.ico" rel="icon" />  自闭合标签&&单标签
		 -->
        
        	<!-- 
				<b></b>加粗
				<i></i>斜体
			-->
		<b><i>在里面的内容被加粗斜体</i></b>
	</body>
</html>

标题标签

<body>
        <!-- 
            <h1>标题</h1>
            共有六级标题标签从h1-h6
            align="center" 标题居中
            一个标题占一行
        -->
		<h1 align="center">一级标签</h1>
		<h2 align="center">二级标签</h2>
		<h3 align="left">三级标签</h3>
		<h4 align="left">四级标签</h4>
		<h5 align="right">五级标签</h5>
		<h6 align="right">六级标签</h6>
</body>

段落标签

<!--
    <p>第一段内容</p>
    段落之间会有间隔
    style="text-indent:2em" 首行缩进两个单位
    <br/> 换行标签
	align="center" 居中
-->
<body>
	<p style="text-indent:2em">
		这里是换行标签<br/>,属性是首行缩进两个字符,相邻两段之间会有间隔
	</p>

	<p align="center">
		这是第二段话,属性居中
	</p>
</body>

特殊符号

<!-- 
	空格 &nbsp;
	小于号 &lt;
	大于号 &gt;
	版权&copy
	商标 &trade;
	注册商标 &reg;
-->

有序列表

    <!--
	type="A,a,I,i,1" 多种序号方式
	<ol></ol> 自动排序,自动编号
-->
	<ol type="I">
		<li>第一列表 </li>
		<li>第二列表</li>
		<li>第三列表</li>
	</ol>

    无序列表

      <!-- 
	没有序号排序
	type="circle,square,disc" 类型选择
-->
无序列表
	<ul type="circle">
		<li>第一列表 </li>
		<li>第二列表</li>
		<li>第三列表</li>
	</ul>

      超链接

      <!--
	<a href="http://www.baidu.com" target="_blank">需要添加超链接的内容</a>
	href="跳转网页"
	target="_blank"跳转时重新打开一个窗口
	target="_self" 在本窗口打开
	同一项目下只需写文件名称
-->	
	<a href="http://www.baidu.com" target="_blank"> 百度</a>
	<a href="http://www.tencent.com" target="_blank"> 腾讯</a>

      图片插入

      <!--
	<img src="图片路径"/>图片标签
	alt="图片加载不出来显示"
	title="鼠标移动到图片上显示的内容"
	图片的长宽厚width height border
-->
	<img  src="img/2.jp"
	alt="图片加载不出来显示的内容"
	title="鼠标移动到图片上显示的内容"/>

      总结：

      <b>加粗</b>
<i>斜体</i>
align="center"居中
<h1>一级标题
<link href="img/图片" rel="图片属性" />
<p>段落</p>
<br/>换行
<hr/>横截线
<ol type="样式"><li>有序列表</li></ol>
<ul type="样式"><li>无序列表</li></ul>
空格 &nbsp;
小于号 &lt;
大于号 &gt;
版权&copy
商标 &trade;
注册商标 &reg;
<a></a>超链接
    href="链接" 
    targe="_blank"打开新建窗口
<img src="img/图片.jpg"/>插入图片
    alt="图片加载不出来显示的内容"
	title="鼠标移动到图片上显示的内容"
      posted @ 2021-05-14 12:17  肖帆咪  阅读(297)  评论(0)    收藏  举报