html5学习记录

加粗:<strong></strong> <b></b> 推荐strong，语义更强烈
倾斜:<em></em> <i></i> 推荐用em,语义更强烈
删除线:<del></del> <s></s> 推荐del
下划线:<ins></ins> <u></u> 推荐 ins
<div></div> <span></span>没有语义，是一个盒子，用来装内容的，布局网页的 div—>division:分割,分区。span->跨度,跨距
<div></div> 一行只能放一个,大盒子  <span></span> 可在一行中多个显示,小盒子
<img src=""/> 单标签 属性如下:(属性不分前后顺序)
        alt:图像显示不出来时调用<img src="" alt="显示不出来"/>
        title:鼠标放在图片上时显示的文字 <img src="" title=""/>
        width:设置宽度 <img src="" width="500" height="500"  />  单位:像素
        height:设置高度 width height只设置一个时另一个会等比例改变
        border:设置图像边框粗细   <img src="" width="" border="15"/> 边框颜色、是否圆角可通过css修改
<a href="">文本或图像</a>
        指定页面打开方式:target=_self、_blank  <a href="" target="_self"> </a> _self:默认当前窗口打开 _blank:在新窗口打开
        链接:内部链接、外部链接、锚点链接(点击时可以快速定位到页面中的某个位置)
        外部链接:访问例如百度等网站
        内部链接:访问项目文件夹同一目录中的其他网页或者下载文件
        锚点链接:<a href="#two">第二集</a> 必须要加#号  <h1 id="two">第二集介绍</h1>
        空链接:<a href="#">xxx</a>
注释:    <!----> 或ctrl + /
特殊字符: 空格:&nbsp; <: &lt  >: &gt
表格:
        作用:主要用来显示、展示数据
        语法:  <table>
                <tr>  定义行(tr->table row缩写)
                        <td></td>  定义单元格(td—>table data的缩写
                </tr>
              </table>
        表头单元格:<th></th> ->table head缩写,一般位于第一行或第一列，表中内容会自动加粗居中显示
        属性(放置在<table></table>):实际开发中并不常用，后面通过CSS来设置，但需要记住属性单词，CSS中会用到
              浏览器中表格的对齐:align=left center right
              边框:border:1或0
              内容与边框之间距离: cellpadding=像素值 默认为1像素
              单元格之间的空白:  cellspacing=像素值  默认为2像素
              规定表格的宽度: width=像素或百分比
        表格结构标签:<thead><tr><th></th></tr></thead>  <tbody><tr><td></td></tr></tbody>
              为了更好的表示表格语义,将表格分割成表格头部和表格主体两大部分(感觉实际用处不大,为了便于查看)
        合并单元格:目标单元格属性<td></td>
              跨行合并:rowspan="合并单元格个数"
              跨列合并:colspan="合并单元格个数"
列表:
        无序列表:(ul->unorder list)
                <ul>
                        <li>列表项1</li>
                        <li>列表项2</li>
                </ul>
                <ul></ul>中只能放<li></li>,<li></li>相当于一个容器,里面可以放任何标签,无序列表有自己的样式属性(开头的小黑点),实际使用时用CSS设置
        有序列表:(ol->order list)
                <ol>
                        <li>one</li>
                        <li>two</li>
                </ol>
        自定义列表:常用于对术语或名词进行解释描述
                <dl>                            <dl></dl>用于定义描述列表或定义列表
                        <dt>名词1</dt>          <dt></dt>定义项目/名字
                        <dd>名词1解释</dd>       <dd></dd>描述每一个项目/名字
                        <dd>名词1解释</dd>
                </dl>
                后期可通过css修饰
表单:   为了收集用户信息
        结构:表单域、表单控件(表单元素)、提示信息
        表单域:是一个包含表单元素的区域
                <form action="demo.php" method="post" name="name1">会把它范围内的表单元素信息提交给后台服务器

                </form>
        表单元素:(后期可通过CSS修饰)
                input输入表单元素:
                        <input type="属性值" name="" value="" checked="" maxlength=""/>
                                type:让不同表单元素展示不同的形态
                                        button:可点击按钮,多数情况下用于通过JavaScript启动脚本
                                        checkbox:复选框   复选框也可设置name属性
                                        file:输入字段和“浏览”按钮,共文件上传,上传文件时使用 上传文件:<input type="file" />
                                        hidden:隐藏的输入字段
                                        image:图像形式的提交按钮
                                        password:密码字段,该字段中的字符被掩码
                                        radio:单选按钮  多个单选按钮只能选其一时需要为表单元素设置name 男:<input type="radio" name="sex"/> 女:<input type="radio" name="sex"/>
                                        reset:重置按钮，清除表单中的所有数据    <input type="reset" value="按钮框中自定义文字"/>
                                        submit:提交按钮，将表单数据发送到服务器   <input type="submit" value="按钮框中自定义文字"/>
                                        text:定义单行的输入字段,用户可在其中输入文本,默认宽度为20个字符
                                name:定义input元素名称,用于区分不同的表单.多个单选按钮只能选其一时(如性别按钮)需要为表单元素设置name
                                value:规定input元素默认的值 input文本框中会显示默认值,单选框、复选框中不会在页面中显示,针对后台使用
                                checked:规定input元素首次加载时应当被选中,主演针对单选按钮和复选框<input type="checkbox" checked="checked"/>
                                maxlength:规定输入字符的最大长度
                                name、value是每个表单元素都有的属性值,name表单元素的名字,要求单选按钮和复选框要有相同的name
                                label标签:
                                <label></label> 用于绑定一个表单元素,当点击label标签内文本时,浏览器会自动将焦点(光标)转到或者选择对应的表单元素上,用来增加用户体验
                                <label for="sex">男</label> <input type="radio" name="sex" id="sex" />
                                <label for="text">用户名:</label> <input type="text" id="text">
                                for与id属性应一致
                select下拉表单元素:
                        <select>至少包含一个option标签
                                <option>option1</option>在<option>中定义selected="selected"时,当前项即为默认选中项
                                <option>option2</option>
                                <option selected="selected">option3</option>
                        </select>
                textarea文本域表单元素:(与文本框相比,文本域可以写很多行文本)当输入内容较多时要用textarea
                        <textarea rows="显示的行数" cols="每行中的字符数"></textarea>
                        实际开发中不会使用rows cols,都是用CSS来改变的