HTML小白学习手记

刚开始接触HTML的时候,感觉有些迷茫,不过慢慢了解了一些基础知识后,觉得HTML还是挺有趣的呢!下面是我整理的一些HTML基础知识点,希望能帮到和我一样刚开始学习HTML的小伙伴哦!

HTML 文档的小骨架

一个完整的HTML文档,其实就像一个精致的小骨架,有头部、身体,每个部分都扮演着重要的角色。

DOCTYPE html>    
<html lang="zh">    
<head>    
    <meta charset="UTF-8">    
    <title>我的示例网页title>    
head>    
<body>    
    <h1>欢迎来到我的网页h1>    
    <p>这里是一些有用的信息。p>    
body>    
html>

神秘的

你知道吗?每一篇HTML文档最前面,都有一个神秘的声明。它就像文档的身份证,告诉浏览器:“嘿,我是一个HTML5文档哦!”这样,浏览器就能更准确地为我们展示网页内容啦!

标题也分级哦

在HTML里,标题可不是随便写的。从大到小,有

六种级别呢!就像我们写作文时的大标题、小标题一样,HTML标题也能让网页内容更有层次。

段落小助手

想要把文字内容分得清清楚楚?那就用

标签吧!每个

标签,都能帮我们把文字包裹成一个独立的段落,让网页看起来更整洁、易读。

点点链接,通通世界

HTML里的标签,就像一扇扇通往其他网页的任意门。只要轻轻一点,就能跳转到其他网页去冒险啦!记得给链接加上有意义的文字描述哦,这样别人就知道这扇门通往哪里啦!

<a href="https://blog.csdn.net/e7182818?spm=1011.2266.3001.5343">访问示例网站获取更多信息a>

图片小精灵

想让网页更生动、有趣?那就少不了图片小精灵啦!只要指定好图片的路径和替代文字,就能轻松地把图片插入到网页中去。还可以给图片加上宽度和高度属性,让它在不同设备上都能美美地显示呢!

HTML小白学习手记_第1张图片

<img src="https://img-blog.csdnimg.cn/direct/4f18ca17ae744afea41b902b771d5c44.jpeg" alt="这是我的一张自画像,仅用于展示如何插入图片。不可侵犯我的肖像权哦" style="width: 500px; height: 300px;">

网页背后的秘密

每次看到漂亮的网页,我都会好奇它是怎么做出来的。其实,只要掌握了HTML基础知识,我们也能做出同样漂亮的网页哦!想看网页背后的HTML源代码?简单!在浏览器里按Ctrl+U,或者右键点击网页选择“查看网页源代码”,就能一探究竟啦!

而且哦,浏览器的开发者工具(F12)还能让我们实时地查看和编辑网页的HTML和CSS代码呢!对于学习和调试网页来说,这真是个超级好用的神器哦!
HTML小白学习手记_第2张图片

你可能感兴趣的:(内秀外美,#,HTML,学习笔记,笔记,html)