常见的块元素
常见的块元素有<h1>~<h6>,<p>,<div>,<ul>,<ol><li>...
文字类的标签内不能使用块级元素，比如<p>,<h1>~<h6>等标签主要用于存放文字，因此标签内不能放块级元素。
行内元素的特点
常见的行内元素有<a>,<strong>,<em>,<span>...
链接里不能再放链接;
特殊情况链接<a>里可以放块级元素，但是给<a>转换一下块级模式最安全。
行内块元素：inline-block
<input/>,<img/>,<td>,同时具有块元素和行内元素的特点。
一行显示多个，但两个元素之间有空白缝隙；
默认宽度是内容本身的宽度；
width、height、padding、margin可控制。
块级元素：block
1.独占一行
2.可以设置width/height
3.默认width是父级元素宽度的100%
4.块级元素里可以放块级元素和行内元素
行内元素：inline
1.一行可以显示多个
2.width/height设置无效
3.width默认内容的宽度
4.行内元素里只能放文字或者其它行内元素
algin:图片的对齐属性
center图片和文字居中对齐
top文字显示在图片的顶部
bottom文字跟图片顶部对齐
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>基础</title>
<style>
*{padding:0;margin:0;}
/*块级元素:block
1.独占一行
2.可以设置width/height
3.默认width是父级元素宽度的100%
4.块级元素里可以放块级元素和行内元素*/
.tag-block{width:40px;height:50px;}
.tag{background:blueviolet;width:200px;height:150px;}
/*行内元素:inline
1.一行可以显示多个
2.width/height设置无效
3.width默认内容的宽度
4.行内元素里只能放文字或者其它行内元素*/
.tag-inline{background: brown;}
/*行内块元素:inline-block
1.一行可以显示多个
2.默认宽度是内容的宽度
3.可以设置width/height */
.tag-inline-block{background: gold;width:100;height:100;}
</style>
</head>
<body>
<p class="tag-inline">p标签</p>
<div class="tag-block">div标签</div>
<h4 class="tag-inline-block">h4标签</h4>
<ul>
<li class="tag">列标签</li>
<li class="tag">列标签</li>
</ul>
<ol>
<li class="tag">列标签</li>
<li class="tag">列标签</li>
</ol>
<span class="tag">span标签</span>
<strong class="tag">fffff</strong>
<a href="" class="tag">a标签</a>
<input type="text" class="tag"/>
<!--algin:图片的对齐属性
center图片和文字居中对齐
top文字显示在图片的顶部
bottom文字跟图片顶部对齐-->
<img src="img/1369025_140924134000_2.jpg" class="tag" align="center">
</body>
</html>
最后有什么学习编程的心得和感想，欢迎在评论区下方留言交流[微笑]