HTML小白学习-1.0

最新推荐文章于 2024-11-03 20:03:09 发布

&GR

最新推荐文章于 2024-11-03 20:03:09 发布

阅读量280

点赞数

文章标签： html html5

本文链接：https://blog.csdn.net/weixin_47063861/article/details/117446904

版权

HTML小白入门学习

如果你想学习如何开发前端, 可以仔细阅读这篇文章，了解一下html的基本语法知识。

常用标签

<!DOCTYPE html> 是一个声明，表示该文档是由 HTML5 进行编写的。
<!--...--> 用来在源文档中插入注释。注释不会在浏览器中显示。
<base> 标签用于设置相对 URL 的解析基准。
<body> 标签定义文档的主体。
<style> 标签用于为 HTML 文档定义样式信息。
<link> 标签用于指定外部资源。
<script> 标签用于在 HTML 文档中加入脚本（例如 JavaScript）。

<br>标签用于插入一个简单的换行符。
<h1> - <h6> 标签可定义标题。
<hr> 标签用于在 HTML 页面中创建一条水平分隔线。
<p> 标签用于定义一个段落。
<img> 标签用于向网页中嵌入一幅图像。
<a> 标签用于定义超链接，超链接可以让用户从一个网页跳转到另一个网页。
<i> 标签用于定义表示斜体的文本。
<ol> 标签用于定义有序列表。
<ul> 标签用于定义无序列表。
<li> 标签定义列表项目
<font> 规定文本的字体、字体尺寸、字体颜色。
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行
<span>是一个行内元素。可以多个标签同处一行

块级元素和行内元素

行内元素:

特点:就可以和其他元素在一行显示，不能自动换行，不能设置宽高
常见行内元素:a,span,i,u,em,sub,sup

块级元素:

特点:不可以和他的元素在一行，可以自动换行，可以设置宽高
常见的块级元素:div,p,h,ul,li,dl,dt,dd

行内块级元素:

特点:可以和其他元素保持在一行，还能设置宽高
常见元素:textarea,input,img,button

实体元素

实体：

在HTML中，某些字符是预留的。
HTML中的预留字符必须被替换为字符实体。

例如：在HTML 中不能使用小于号(<）和大于号(>)，这是因为浏览器会误认为它们是标签。如果希望正确地显示预留字符，我们必须在HTML 源代码中使用字符实体(character entities)。

常见的字符实体如下图所示：
在这里插入图片描述

超链接与图片标签

<a href="网址、链接所在" target="目的" title="说明">被链接内容</a>

href=“网址、链接”
target指标值以下：规定在何处打开链接文档。
_blank – 在新窗口中掀开链接
_parent – 在父窗体中翻开链接
默认值 _top – 在目前窗体打开链接

图片链接：

<img src="smile.gif" alt="smile" width=100px height=200px />

在这里插入图片描述

相对路径和绝对路径

相对路径：相对于当前文件路径下的操作路径

优点：路径简单明了，不随运行环境变化而变化
缺点：每次都需要计算相对位置，容易出错
具体操作：./（当前目录) ../(父级目录). /(根目录)

绝对路径：直接从磁盘的位置去定位文件的地址。

优点：路径简单明了，便于搜索引擎搜索
缺点：缺点：不容易移植，如果项目域名变化或者移植，到新文件夹，所设置的路径都会失效
具体操作： https:// D:\mysql

列表

无序列表
有序列表
自定义列表

简单菜谱模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>《糖醋排骨》的制作方法</h1>
    <b>菜名名称：</b>糖醋排骨
    <br>
    <b>市场价格：</b>26
    <br>
    <b>会员价格：</b><font color="#FF0000">24</font>
    <br>
    <b>使用配料：</b>排骨、糖、醋
    <br>
    <b>菜品类型：</b>炒菜
    <br>
    <h4 style="text-decoration: underline;"><i>做法：</i></h4>
    <p>1.猪小排洗净，晒干水分备用；</p>
    <p>2.锅内倒少量油，烧开之后，爆香姜片；</p>
    <p>3.放入排骨，一直煸炒到排骨变色后，表面金黄微焦；</p>
    <p>4.此时就可以放入黄金比例的调料了，顺序是，先放一汤勺料酒，接着两汤勺酱油，三汤勺米醋最后四汤勺白糖，炒匀；</p>
    <p>5.再倒入能没过排骨的开水，调中小火焖20分钟</p>
    <p>6.20分钟后调入盐，开大火收汁，收到汁浓色亮时，撒入芝麻点缀即可出锅（锅里剩下的姜片丢掉不用，最后大火收汁时注意多翻动锅内的排骨，避免烧焦呦！）</p>
    <hr>
    <p>&copy2015 阿婆私房菜</p>
</body>
</html>