前端基础-HTML结构

最新推荐文章于 2024-09-21 11:29:05 发布

laizhuoyu

最新推荐文章于 2024-09-21 11:29:05 发布

阅读量187

点赞数

分类专栏：前端文章标签： HTML 前端

本文链接：https://blog.csdn.net/laizhuoyu/article/details/79933188

版权

3 篇文章 0 订阅

订阅专栏

前言:为什么写这篇文章呢,老师让我们写个博客对比TypeScript和JavaScript,然而我好像(不仅只是好像)并不清楚他们是什么,拿来做些什么,并没有办法用自己的语言来描述这个问题,所以我想为什么不从头开始,从最简单的基础开始学起呢?

好了扯了这么多,正式开始写这篇博客,首先先说说HTML吧!

HTML是什么呢?它的全称:HyperText Markup Language(超文本标记语言)

是不是看起来很高大上呢,然而我们再看看最简单最基本的HTML语言的结构:

HTML语音无非就两种结构,目前我没看到第三种,如果有的话,请你告诉我

一个是有头有尾的:<标签属性="属性值"></标签>

另一个是有头无尾的:<标签属性="属性值">

下面就是最基本的HTML的代码,每次用的时候,基本复制多来用就行了,直接在浏览器中打开发现什么都没有,这就正常了,在仔细看一下可以看出标题里的内容就是<title></title>中间的内容

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>标题</title>
    </head>
    <body>
    </body>
</html>

head段中包括了标题,常用来声明一些内容

body段就是我们在网页上看到的内容,由于什么都没写,你当然看不到什么了,如果加上一段字在打开就可以在浏览器上看到你写的字,要在网页上添加更多内容就需要掌握一些常见的标签.

先看一下有头有尾类型的例子:

显示这段后换行

加粗

给指定内容加链接: <a href="www.baidu.com"> 百度</a>,点击之后跳转到了百度的页面

再看下有头无尾的:

换行

<img src="图片地址"/>显示指定图片

HTML是不是很简单,只需要在用的时候查一下标签的作用和它的属性值,就可以完成相应的事情了

编写HTML就可以完成网页的大体的简单结构

是不是感觉HTML和某个常用的文字编辑软件(word)所做到的事情很像,所有我想有没有哪些可视化软件可以完成对HTML的开发,这样就可以很方便的完成网页的结构,等我知道再告诉你吧

关注

专栏目录