Java的开篇入门------------------Html

码农(学习版)

已于 2023-11-05 22:49:51 修改

阅读量117

点赞数 6

分类专栏： HTMl+CSS 文章标签： html 前端

于 2023-11-05 22:48:49 首次发布

本文链接：https://blog.csdn.net/Lebly/article/details/134235300

版权

HTMl+CSS 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

HTML是什么？

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

html不是一种编程语言，而是一种标记语言（markup Language）。

标记语言是一套标记标签（markup tag）。

那么所谓的超文本语言中的超文本是什么意思呢？？？

所谓超文本有两层定义：

1.它可以加入图片、声音、动画、多媒体等内容（超越了文本限制）。

2.它可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超链接文本）

Web 标准（重点）

Web标准是由W3C组织和其他标准化组织制定的一系列标准的集合。W3C（万维网联盟）是国际最著名的标准化组织。

为什么需要Web标准

1.浏览器不同，它们显示页面或者排版有些许差异。

2.可以让不同的开发人员写出的页面更加标准

3.内容能被更广泛的设备访问

4.更容易被搜索引擎搜索等等

Web标准的构成

主要包括结构、表现和行为三个方面

结构现阶段就是我们即将要学习到的HTMl

表现主要指的是我们学完HTML以后要学习的CSS

行为主要学习的是JavaScript

HTML基本结构标签

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>我是标题</title>
    </head>
        <body>
            我是身体
        </body>
</html>

<!DOCTYPE> 文档声明类型就是告诉浏览器使用哪种HTML版本来显示网页

<html>...</html> 页面最大的标签，我们称它为根标签

<head>...</head> 文档中的头部

<title>...</title> 文档中的标题也可以理解为脑子

<body>...<body> 文档中的主体文档中的内容页面内容基本都是放进去也可以叫做身体

注意：HTML文件的后缀必须是.html

3.1 标题标签

HTML 标题是通过<h1> ~ <h6> 标签来定义的.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>标题标签</title>
</head>
<body>
 
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>
 
</body>
</html>

3.2 段落标签

HTML 段落是通过标签 <p> 来定义的

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>段落标签</title>
</head>
<body>
 
<p>我是第一个段落</p>
<p>我是第二个段落</p>
<p>我是第三个段落</p>
 
</body>
</html>

3.3 超链接

HTML 链接是通过标签 <a> 来定义的

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>超链接标签</title>
</head>
<body>
 
<a href="https://blog.csdn.net/Lebly/article/details/134233209?spm=1001.2014.3001.5502">
这是一个链接使用了 href 属性</a>
 
</body>
</html>

3.4 图片插入

HTML 图像是通过标签 <img> 来定义的。注意： 图像的名称和尺寸是以属性的形式提供的。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>图片插入</title>
</head>
<body>
 
<img src="图片1.jpg" width="264" height="6" />
 
</body>
</html>

3.5 表格

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。td 指表格数据，即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落等等。表格的表头使用 <th> 标签进行定义。如果不定义边框属性，表格将不显示边框。

<table border="1">
    <tr>
        <th>表头1</th>
    </tr>
    <tr>
        <td>单元格1</td>
    </tr>
    <tr>
        <td>单元格2</td>
    </tr>
</table>

border是table中的属性意思是边框为1像素

3.6 基本标签

<h1>最大的标题</h1>
<h2> . . . </h2>
<h3> . . . </h3>
<h4> . . . </h4>
<h5> . . . </h5>
<h6>最小的标题</h6>
 
<p>这是一个段落</p>
<br></br> （换行）
<hr></hr> （水平线）

3.7 文本格式化

<b>粗体文本</b>
<strong>粗体文本/strong>
<em>斜体文本</em>
<i>斜体文本</i>
<small>更小的文本</small>
<del> （删除的文本）
<ins> （插入的文本）
<sub> （下标文本）
<sup> （上标文本）

3.8 样式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style type="text/css">
    h1 {color:red;}
    p {color:blue;}
    </style>
    <div>文档中的块级元素</div>
    <span>文档中的内联元素</span>
<body>
    
</body>
</html>

3.9 无序列表

<ul>
    <li>12</li>
    <li>13</li>
</ul>

3.10 有序列表

<ol>
    <li>第一个</li>
    <li>第二个</li>
</ol>

3.11 定义列表

<dl>
  <dt>列表标题1</dt>
    <dd>描述1</dd>
  <dt>列表标题2</dt>
    <dd>描述2</dd>
</dl>

3.12 框架

<iframe src="demo_iframe.htm"></iframe>

3.13 表单

<form action="URL" method="post/get">
<input type="text" name="email" size="40" maxlength="50">
<input type="password">
<input type="checkbox" checked="checked">
<input type="radio" checked="checked">
<input type="submit" value="Send">
<input type="reset">
<input type="hidden">
<select>下拉列表
<option>苹果</option>
<option selected="selected">香蕉</option>
<option>樱桃</option>
</select>
<textarea name="comment" rows="60" cols="20">文本域</textarea>
 
</form>

3.14 符号

&lt;        <
&gt;        >
&copy;      ©
&amp;       &
&reg;       ®
&trade;     ™
&times;     ×
&divide;    ÷

码农(学习版)

关注

6
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Java的开篇入门------------------Html

列表标题1描述1列表标题2描述2
复制链接

扫一扫

专栏目录