[初学者] HTML+CSS能干什么？
Posted 52瞎折腾
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了[初学者] HTML+CSS能干什么？相关的知识，希望对你有一定的参考价值。
有一天，你发现了一个新的网站。“哇，这个网页好漂亮啊，我好想知道它怎么做出来的。”于是在网页上右键->查看源代码，显示器上出现如下内容：
![[初学者] HTML+CSS能干什么？](https://image.cha138.com/20210818/0d5486c8db194fe9a6c9685151d2a8b0.jpg)
(emoj:微笑)这，这都是什么……
你忽地想起来，它们是用html，CSS，javascript写的，其中HTML决定所有网页元素的布局，CSS控制渲染风格，JavaScript完成动态交互。
先看个用代码写的简单的表白网页
视频大小：6M
我们不妨温习一下HTML的基本知识，大概就能知道它在说什么了。
什么是 HTML？
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
什么是标签？
标签是什么呢？
<p>左右两个尖括号以及其内容就是标签</p>
HTML 编辑器
对HTML有了一个初步认识之后，我们需要一个方便做实验的环境。
可以使用专业的 HTML 编辑器来编辑 HTML：
Adobe Dreamweaver
Microsoft Expression Web
CoffeeCup HTML Editor
当然你也可以用Notepad (PC) 或 TextEdit (Mac)这样的文本编辑器，甚至是用记事本写网页，他们的体量很小，而且用起来也很方便。
保存html文件
在保存文件的时候，后缀html或者htm即可。Windows会自动使用您的默认浏览器打开此类文件。
您可以试着在文件中胡乱输入一些文本，然后用浏览器打开。
通常情况下，文本将会被原封不动地显示在屏幕上，只是没有美观的样式和布局。
![[初学者] HTML+CSS能干什么？](https://image.cha138.com/20210818/95f84fe2c56d4003862d608796b3846f.jpg)
HTML基础知识
还记得我们刚才说的嘛，html用一套标签来描述网页。
<html>
<body>
<h1>这是个标题</h1>
<p>这是个段落</p>
<p>这还是个段落</p>
<p>下个段落啥也没有</p>
<p></p>
</body>
</html> （您可以把这些文字输入文件，看看效果）
![[初学者] HTML+CSS能干什么？](https://image.cha138.com/20210818/dff74a7442934f8fa83ef405b9cb95d0.jpg)
可能您已经猜到了，<h1></h1>之间的部分是大标题，<p></p>之间则是个段落。
大部分html中的标签都是闭合的，也就是说，<h1>和</h1>要配套使用，虽然某些浏览器可以正常处理未闭合标签，但是为了避免意想不到的错误，我们在使用的时候最好闭合标签。
某些HTML标签可以具有空内容。
HTML样式
大部分的标签中，您可以通过如下简单的语法为文本添加样式：
<p style="color:green">看！这些字绿了！</p>
![[初学者] HTML+CSS能干什么？](https://image.cha138.com/20210818/8462efcf77db4b22a9cca79c4b781e2b.jpg)
注：更多的样式，请参见HTML文档。
HTML链接
“点一下，玩一年，XX不花一分钱！”
您在点了网页上某段文字或图片之后，就有可能会跳转到上面的页面（音效画面请自行脑补）。这就是超链接，我们可以如下的方式标记超链接。
<a href="url">这个是链接</a>
比如：
<a href=http://www.baidu.com>皮皮虾，我们走！</a>
然后我们就获得了指向百度的超链接。
![[初学者] HTML+CSS能干什么？](https://image.cha138.com/20210818/0e4fb461de98412c923202f13b9fb485.jpg)
有了上述的知识，我们是不是就可以给自己做个门户网站了呢？发挥创造力吧！
到了这里，我们可以继续尝试阅读之前看到的网页源代码。
最后的话
最后，推荐 w3school这个网站，一站式web开发教程，新世界的大门，已经打开n_n!。
顺便说一句，微信小程序的开发，其实也和web开发类似，三件套HTML,CSS,JS就是开物的利器。
再顺便说一句，可以试图打开在某hao门户站或者某弹幕视频站的网页源代码。（密恐福利！）
以上是关于[初学者] HTML+CSS能干什么？的主要内容，如果未能解决你的问题，请参考以下文章