首页 > 代码库 > 16-11-08
16-11-08
今天的学习内容大致分两部分：1.田字格的制作 2.文章段落的编辑 期间接触到的一些新命令包括：<border>边框、<margin>外边框、<padding>内边距、<h>字体大小、<p>段落标签、<br>打断、< >空格、<border-radius>圆角、<text-indent>缩进。
1.田字格编码详细
<html>
<head>
<title>田字格</title>
<style>
#all{
width: 450px;
height: 450px;
/*外边距*/
margin: 0px auto;
}
.a{
width: 200px;
height: 200px;
background-color: #00FF00;
float: left;
margin: 10px;
} </style>
<body>
<div id=“all”>
<div class="a" id="first"></div>
<div class="a" id="second"></div>
<div class="a" id="third"></div>
<div class="a" id="fourth"></div>
</div>
</body>
</html>
通过在大的div中创建小div，控制小div在大div中漂浮以此达成田字格形式，再通过调整大div的外边距<nargin>,便可调整田字格在网页中的位置。
2.文章段落的编辑
文章段落和文章标题建立在<body>中，可以用不同的字号<h>命令区分开，段落建立在<p></p>中便可分出段落，若想另起一行，可以再要另起一行的文字前输入<br>命令。背景色设置仍是<background-color>,字体颜色<color>。
但是这种形式的创建段落，并不能生成段前的空格缩进，需在段前输入< >命令这代表一个空格，也可以在<head>中编辑<style>命令输入<text-indent>然后给出段前缩进的像素值即可。
今天的学习个人感觉比较轻松有趣，要学会在操作中的举一反三，将会有很大提升，希望在接下来的学习中，继续保持良好的状态。
16-11-08