一些笔记。。

昨天做的一个demo ：点击打开链接

vertical-align: middle; 设置元素的垂直对齐方式 就是以中间对齐的。

 table-cell:对象代表一个 HTML 表格单元格

cursor: pointer;  鼠标移过去指针不同

font-weight: 500;  文字的粗细

设置一个导航的列表大概是这样的

nav ul {
 float: right;
 margin: 0;
 padding: 0;
}
nav ul li {
 float: left;
 margin: 15px;
 line-height: 70px;
}
nav ul li a {
 color: #fff;
 text-decoration: none;
}
nav ul li a:hover {
 color: gray;
}

 <input type="password" name="mima" id="mima" placeholder="这是一个文本输入框" pattern="[A-Za-z0-9\-]*" class="pb" minlength="6" maxlength="16">

一个密码框， 为大小写字母和数字 长度为6-16

<div class="suo">性别：</div>
     <input type="radio" name="sex" id="man" checked="checked"/>
     <label for="man">男</label>
     <input type="radio" name="sex" id="woman"/>
     <label for="woman">女</label>

for中的内容要和id相等。。

<table border="1">
    <thead>
     <tr class="tr_color">
      <th align="left">表头</th>
      <th align="left">表头</th>
      <th align="left">表头</th>
     </tr>
    </thead>
    <tbody>
     <tr>
      <th align="left">表格内容单元</th>
      <th align="left">表格内容单元</th>
      <th align="left"><a href="#">操作</a></th>
     </tr>
    </tbody>
    <tr>
     <th align="left">表格内容单元</th>
     <th align="left">表格内容单元</th>
     <th align="left"><a href="#">操作</a></th>
    </tr>
    <tbody>
     <tr>
      <th align="left">表格内容单元</th>
      <th align="left">表格内容单元</th>
      <th align="left"><a href="#">操作</a></th>
     </tr>
    </tbody>
    <tbody>
     <tr>
      <th align="left">表格内容单元</th>
      <th align="left">表格内容单元</th>
      <th align="left"><a href="#">操作</a></th>
     </tr>
    </tbody>
    <tfoot>
    <tr>
     <th align="left">总计</th>
     <th align="left" colspan="2">1000</th>
    </tr>
    </tfoot>
   </table>

一个左对齐表格，，不要给表格设置什么宽度，就会随着页面自动缩放了。colspan="2" 代表一列占了上面的两列，rowspan代表一行占了多行。

article {
	background-color: #fff;
	box-shadow: 2px 2px 2px #848484;
	margin-left: 50px;
	margin-top: 40px;
	margin-right: 450px;
	padding: 20px;
}

这个demo的左边布局主要是这个

aside {
	float: right;
	width: 350px;
	background-color: #fff;
	margin-top: 40px;
	margin-right: 20px;
	margin-left: 20px;
	padding: 20px;
	box-shadow: 2px 2px 2px #848484;
}

这个demo的右边布局

<footer>
			<span>版权所有&copy; skymiange<a class="name" href="#"> 侵权必究</a></span>
		</footer>

脚注 &copy可以直接表示出来的。

footer {
	width: 100%;
	height: 60px;
	text-align: center;
	background: #000;
	color: #fff;
	font-weight: 500;
	font-size: 14px;
	line-height: 60px;
}

脚注的css