HTML 定义了网页的内容
CSS 描述了网页的布局
JavaScript 网页的行为
HTML基本知识
(1) HTML 指的是超文本标记语言 (Hyper Text Markup Language)
(2) HTML 不是一种编程语言,而是一种标记语言 (markup language)
(3) 标记语言是一套标记标签 (markup tag)
(4)HTML 使用标记标签来描述网页
<!—hexoPostRenderEscape:
<html>
<body>
<h1>My First Heading </h1>
<p>My First Body</p>
</body>
</html>
</code></pre>:hexoPostRenderEscape—>
代码解释
<html> 与 </html> <!-- 之间的文本描述网页 -->
<body> 与 </body> <!--之间的文本是可见的页面内容 -->
<h1> 与 </h1> <!--之间的文本被显示为标题 -->
<p> 与 </p> <!-- 之间的文本被显示为段 -->
HTML标签
HTML 标签是由尖括号包围的关键词,比如 <html>
HTML 标签通常是成对出现的,比如 <p> 和 </p>
标签对中的第一个标签是开始标签,第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签
HTML编辑器
可以使用文本编辑器,例如NotePad++
写第一个HTML代码
首先打开NotePad++,写入代码,如下图:
然后保存,将后缀名改为html;
最后在浏览器中运行,双击已经保存好的html格式:即可出现:
HTML标题
HTML 标题(Heading)是通过 <h1> - <h6>
等标签进行定义的。
例如:
<h1>This is first heading </h1>
<h2>This is second heading </h2>
<h3>This is thirst heading </h3>
HTML段落
HTML 段落是通过 <p>
标签进行定义的.
例如:
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML 链接
HTML 链接是通过 <a>
标签进行定义的。
例如:href属性
<a href="http://www.baidu.com.cn">
HTML图片
HTML 图像是通过 <img>
标签进行定义的。
例如:
<img src="/i/eg_w3school.gif" width="300" height="120" />
CSS
CSS 指层叠样式表 (Cascading Style Sheets)
样式定义如何显示 HTML 元素
样式通常存储在样式表中
CSS语法
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。
属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开。
格式:
selector {property: value}
h1 {color:red; font-size:14px;}
解释:
h1为选择器,color,font-size为属性,red,value为值
注意:值要是为若干个单词需要给值加引号
JS
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。