RWPy4learner 11.3.30 documentation

Version: 11.3.30

HTML与CSS

这模板是怎么回事?看不懂啊……………………

本章将对HTML进行简单的介绍

HTML

这玩意儿好像是用来做网页的嘛!

什么是 HTML?

  • HTML 是用来描述网页的一种语言。
  • HTML 指的是超文本标记语言
  • HTML 不是一种编程语言,而是一种标记语言
  • 标记语言是一套标记标签
  • HTML 使用标记标签来描述网页

嗯嗯嗯,看着就头大,还是从实例来分析吧。

  • 编程这玩意儿,实践出真知的
<html>
<body>
  <h1>Hello,world</h1>
  <p>Python</p>
</body>
</html>

保存为test.html,不用编译,不用解释器,点开就看到了!

嗯嗯嗯,不错!

HTML就是由标签组成的。

<> 括起来的就是标签。

标签通常成对出现的,<xxxx></xxxx>

<p></p>

中间的就是内容。

  • <html> 把网页括起来
  • <body> 把网页内容括起来
  • <h1> 把1号标题括起来
  • <p> 把段落括起来

但是,更复杂一点的呢?

想深入学习的可以到 w3school 学习

CSS

CSS,乃是层叠样式表(英语:Cascading Style Sheets,简写CSS)

如果一种样式在网页中反复出现,那么,有没有办法写成一个function?

有办法的!HTML中的函数,CSS!

写css,需要在title标签内加入代码:

<style type="text/css">
  p {font-size: 10pt}
</style>
../_images/10pt.png

这样就定义了一个样式,在此HTML文档中,所有p标签内的文字都显示为10pt大小!

但是,如果有不同的样式呢?再改:

#text{font-size: 9pt}

定义一个叫做text的样式,字体大小为9pt。

但是打开网页没反应阿!怎么调用阿?

../_images/9pt_error.png

在body加入:

<p id="text">
  Pythonic!
</p>

再运行一下,耶!有反应了

../_images/9pt.png

相关链接

小白觉得还不过瘾,又找到了很多html有关资料