html及css复习总结

由于网站上的免费DW教程看完了于是这周本人转战慕课复习html和css，为后面JavaScript的学习做下准备。

其实之前多多少少学了些DW的技术以后就开始把DW的一些操作和html标签对应起来了，虽然我比较喜欢直接操作软件实现效果但是有些特效是必须要敲代码的，有时候一些琐碎的结构调整也是明显直接改代码来得快，退一万步就算是检查一下网页也要看懂自己写了些啥，所以这一次就整理一下标签和软件操作的关系吧。

之前的操作其实是差不多的，DW里比较直观，很多功能都可以直接输入，比如文字或段落的输入，包括代码，在网页上需要显示代码的时候教程里虽然说需要用<code>或<pre>标签，但我刚刚实验了一下发现如果直接在设计页面输入代码的话是不会另开页面而是被当做文本呈现在网页上，也算是一个比较便利的功能吧。

像插入超链接、图片等也可以通过DW下方工具栏等直接操作实现而不用一个字一个字地打 <a>或<img>，然而有一个就是发送邮件的功能我暂时还不知道要怎么直接实现，还是需要写代码的【<a href="mailto:yy@imooc.com?subject=观了不起的盖茨比有感&body=你好，对此评论有些想法">发送</a>】，不过这个功能似乎不常用……？

表单什么的正好是DW免费教程的最后一章刚刚学过的，DW中的操作为先插入表单，再插入表单域。表格定位一定要放在表单中，可自行设置文本宽度，单选的组名一定要相同，可一次性建立多个单选，下拉菜单的选择（菜单/列表）项目标签尽量与值相等。也可以建立复选框，形成多个选项，文件域可以让用户上传文件。文本区域，即多行文本，比文本字段要大。按钮的功能有提交、重置，和无功能。

相较起软件操作的简便，html代码就略显麻烦了，最简单的一个表单如：

<form method="post" action="save.php">
      <label for="username">用户名:</label>
      <input type="text"  name="username" id="username" value="" />

即显示一个名为username的表单，数据传输到save.php，密码表单可将input type改为"password"，显示出来的就会是圆点或星号。

文本框的代码为<textarea>，可自行调整大小。下拉列表框为<select>，可用selected="selected"设置默认选项，也可用multiple="multiple"设置多选。

还有按钮，DW中的按钮可直接插入并设置按钮属性，代码为<input type>，submit是提交，reset是重置。

最后一个label标签，其实感觉没什么用……就只是改善鼠标用户的体验而已，点击label标签时会自动跳转到对应的表单上，如：

<label for="slow">慢跑</label>


 <input type="checkbox" id="slow" name="manpao"></br>

标签的for属性中的值应当与相关控件的id属性值一定要相同。