这一堂的实践课，我们要用上<p> </p>, <h1> </h1> 。和一些css工具。 实践的网页，做一个自我介绍的小网页。
<!DOCTYPE html> ＃告诉浏览器这是：html5
<html>
<head>
<meta charset="UTF-8"> ＃告诉浏览器unicode编码
<style type="text/css">＃调用css样式
body { ＃修改body的样式
font-family: "Hiragino Sans GB"; ＃使用字体－mac自带冬青
margin-left: 20%; ＃外边距－左－20%
margin-right: 20%; ＃外边距－右－20%
}
blockquote {
background-color: #f88396;
padding-top: 1em;
padding-bottom: 1.2em;
padding-left: 2em;
border-left-style: dotted;
border-left-width:2px;
}
.touxiang {
width: 150px;
height: 150px;
border-radius: 150px;
}
</style>
<title>宝贝女儿的介绍</title>
</head>
<body>
<h1>宝贝女儿李珞伊</h1>
<img class="touxiang" src="images/img_6843.jpeg" alt="女儿照片" >
<P>女儿李珞伊，2015年4月7日三点十五分，出生在我的家乡永修,取名寓意，女儿名伊取于 <q>《诗经》</q>，
<blockquote>
秦风有云<br/>
所谓伊人，在水一方。
</blockquote>
寄望女儿以后可以成为女神，配珞<br>
<blockquote>
老子道德经有云：<br />
珞珞如石
</blockquote>
和若同音，是希望女儿有独立的个性,坚强的心态，是个内心刚强的美人。
</P>
</body>
</html>
以上是简单的网页，元素（element),挺简单的， 上节中我们说了内联元素和块元素。
下面我们一一介绍，上篇源代码，各个元素的运用。
块元素：
块元素是单独行动，在前后各有一个回车。
img是属于块元素吗？
内联元素，为什么img,直接接文字，文字换行了。因为<p>前面有一个回车键啊， >你忘了！
blocksquote:
这是引用， 你们这个元素其实见过，比如简书编辑中的“ ，就是调用blocksquote.还有一个类似的引用，
<q>
em:
经常我们可以看到px, em,%, 这是html的计量单位。
px： 表示字体的像素大小。
％， 这个很好理解了，就与之前的大小对比。
em
任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px
border-radius:
圆角边框的意思，你看我们把一个方形的图片，变成圆框，就是这么简单，一个css就完成了。
. name
代表类name ,什么是类？ 计算机描述世界的一种viewpoint, 比如椅子可以是一个类，可能会有高椅子，三脚椅，等，统一称为类。 高，三脚啊，就是类里面的属性了。
网友评论