前端笔记1-1

---恢复内容开始---

一.html元素

1.html元素

<开始标签> 元 素 内 容 <结束标签>

这就是一个元素:

2.html元素语法

HTML元素语法特点:

HTML 元素以开始标签起始
HTML 元素以结束标签终止
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素具有空内容(empty content)
空元素在开始标签中进行关闭(以开始标签的结束而结束)
大多数 HTML 元素可拥有属性(下面会讲)

3.html元素嵌套

<html>

<head>

</head>

<body>

</body>

</html>

4.html空元素

HTML元素的内容是开始标签与结束标签之间的内容,而某些 HTML 元素具有空内容(empty content),这种元素被叫做空元素。比如说换行符<br>。

现在多用<br/>,<img/>,<hr/>

 <p></p>与<br/>区别

<p></p>相当于两次回车 而<br/>相当于一次回车

<p>

好雨知时节<br/><br/>

当春乃发生<br/><br/>

</p>

<p>

<p>好雨知时节</p>

<p>当春乃发生</p>

</p>

相同

二.html属性

实例:

<a href="http://www.w3school.com.cn">This is a link</a>


<h1 align="center">This is heading 1</h1>  居中显示标题


<body bgcolor="blue"> 主题背景色设定

始终为属性值加引号

属性值应该始终被包括在引号内。双引号是最常用的,不过使用单引号也没有问题。

在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号

三.html标题

1.标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。

<h1> 定义最大的标题。<h6> 定义最小的标题。

注释:默认情况下,HTML 会自动地在块级元素前后添加一个额外的空行,比如段落、标题元素前后。

2.<hr /> 标签在 HTML 页面中创建水平线。

3.html注释

<!-- This is a comment -->

图片源于w3scool

四.html段落

<br/>折行

五.html样式

HTML 的 style 属性

style 属性的作用:

提供了一种改变所有 HTML 元素的样式的通用方法。

样式是 HTML 4 引入的,它是一种新的首选的改变 HTML 元素样式的方式。通过 HTML 样式,能够通过使用 style 属性直接将样式添加到 HTML 元素,或者间接地在独立的样式表中(CSS 文件)进行定义。

<html>
<body style="background-color:yellow">
<h2 style="background-color:blue">This is heading</h2>
<hr/>
<p style="background-color:red">this is paragraph</p>
<hr/>
</body>
</html>

使用html的style属性改变背景颜色↑

总结:在开始标签中加入style="background-color:color"

font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸:

<html>

<body>
<h1 style="font-family:verdana">A heading</h1>
<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
</body>

</html>
总结:各属性放在style引号内用分号隔开
text-align 属性规定了元素中文本的水平对齐方式:
 <h1 style="font-family:verdana;color:red;text-align:center">A heading</h1>

font-family列表
http://blog.csdn.net/cddcj/article/details/70739481
http://blog.csdn.net/shoukui_xu/article/details/12555751
text-align列表
https://developer.mozilla.org/zh-CN/docs/Web/CSS/text-align

---恢复内容结束---

源于w3school哦~~~

原文地址:https://www.cnblogs.com/jieyi/p/8309571.html