为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
初识HTML(5)+CSS(3)_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
  • 技术点的解释:

    a标签有的target属性,代表打开网页的方式。可选值为”_self和_blank”,默认值为_self,代表在当前页面打开链接,_blank代表在新窗口打开链接。

    查看全部
  • 发现书写有误,可以使用重置按钮使输入框恢复到初始状态。只需要把type设置为"reset"就可以。

    语法:

    <input type="reset" value="重置">

    type:只有当type值设置为reset时,按钮才有重置作用

    value:按钮上显示的文字

    查看全部
  • 提交按钮。

    语法:

    <input   type="submit"   value="提交">

    type:只有当type值设置为submit时,按钮才有提交作用

    value:按钮上显示的文字


    查看全部
  • 讲解:

    1、select和option标签都是双标签,它总是成对出现的,需要首标签和尾标签。

    2、select标签里面只能放option标签,表示下拉列表的选项。

    3、option标签放选项内容,不放置其他标签。

    4、value:


    5、selected="selected":

    设置selected="selected"属性,则该选项就被默认选中。

    在浏览器中显示的结果:


    查看全部
  • type:

       当 type="radio" 时,控件为单选框

       当 type="checkbox" 时,控件为复选框

    注意:同一组的单选按钮,name 取值一定要一致,比如上面例子为同一个名称“radioLove”,这样同一组的单选按钮才可以起到单选的作用。

    查看全部
  • label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。就是说,当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上(就自动选中和该label标签相关连的表单控件上)。

    <form
     <label for="email">输入你的邮箱地址</label>
     <input type="email" id="email" placeholder="Enter email">
    </form>

    查看全部
  • 留下您宝贵的意见 - 使用<textarea>标签创建文本域

    <form  method="post" action="save.php">        <label>联系我们</label>        <textarea cols="50" rows="10" >在这里输入内容...</textarea></form>

    查看全部
  •  <input type="email"> 

    技术点的解释:

    1、Input的type属性设置为email,则表示该输入框的类型为邮箱。

    2、数字框的值必须包含@。

    3、数字框的值@之后必须有内容,否则会报错误提示。

    查看全部
  •  <input type="url"> 

    技术点的解释:

    1、input的type属性设置为url,则表示该输入框的类型为网址。

    2、数字框的值需以http://或者https://开头,且后面必须有内容,否则表单提交的时候会报错误提示。

    查看全部
  •   <input type="number">

    技术点的解释:

    1、input的type属性设置为number,则表示该输入框的类型为数字。

    2、数字框只能输入数字,输入其他字符无效。

    3、数字框最右侧会有一个加减符号,可以调整输入数字的大小,不同浏览器表现不一致。

    查看全部
  • placeholder,属性v

    查看全部
  • 语法:

    <form>
      <input type="text/password" name="名称" value="文本" />
    </form>

    1、type:

       当type="text"时,输入框为文本输入框;

       当type="password"时, 输入框为密码输入框。

    2、name:为文本框命名,以备后台程序ASP 、PHP使用。

    3、value:为文本输入框设置默认值。(一般起到提示作用)

    举例:

    <form>
     姓名:
     <input type="text" name="myName">
     <br/>
     密码:
     <input type="password" name="pass">
    </form>

    在浏览器中显示的结果:


    查看全部
  • 讲解:

    1.<form> :<form>标签是成对出现的,以<form>开始,以</form>结束。

    2.action :浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。

    3.method : 数据传送的方式(get/post)。

    1、所有表单控件(文本框、文本域、按钮、单选框、复选框等)都必须放在 <form></form> 标签之间(否则用户输入的信息可提交不到服务器上哦!)。

    2、method : post/get 的区别这一部分内容属于后端程序员考虑的问题。感兴趣的小伙伴可以查看本小节的 wiki,里面有详细介绍。

     

    查看全部
  • <thead>标签表示表格头部,一般放<tr>和<th>标签。

    <tbody>标签表示表格内容,一般放<tr>和<td>标签。

    <tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。

    查看全部
  • <thead>标签表示表格头部,一般放<tr>和<th>标签。

    <tbody>标签表示表格内容,一般放<tr>和<td>标签。

    <tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。


    <tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    查看全部
  • <thead>标签表示表格头部,一般放<tr>和<th>标签。

    <tbody>标签表示表格内容,一般放<tr>和<td>标签。

    <tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。


    <tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    <tfoot> 元素用于对 HTML 表格中的表注(页脚)内容进行分组。

    查看全部
  • <thead>标签表示表格头部,一般放<tr>和<th>标签。

    <tbody>标签表示表格内容,一般放<tr>和<td>标签。

    <tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。

    <thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

    <tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    <tfoot> 元素用于对 HTML 表格中的表注(页脚)内容进行分组。

    查看全部
  • <thead>标签表示表格头部,一般放<tr>和<th>标签。

    <tbody>标签表示表格内容,一般放<tr>和<td>标签。

    <tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。

    <thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

    <tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    <tfoot> 元素用于对 HTML 表格中的表注(页脚)内容进行分组。

    thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时,您也许希望拥有一个标题行,一些带有数据的行,以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时,表格的表头和页脚可被打印在包含表格数据的每张页面上。

    查看全部
  • 1、<thead>标签表示表格头部,一般放<tr>和<th>标签。

    2、<tbody>标签表示表格内容,一般放<tr>和<td>标签。

    3、<tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。

    <thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

    <tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    <tfoot> 元素用于对 HTML 表格中的表注(页脚)内容进行分组。

    thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时,您也许希望拥有一个标题行,一些带有数据的行,以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时,表格的表头和页脚可被打印在包含表格数据的每张页面上。

    查看全部
  • 1、<thead>标签表示表格头部,一般放<tr>和<th>标签。

    2、<tbody>标签表示表格内容,一般放<tr>和<td>标签。

    3、<tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。

    1、<thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

    2、<tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    3、<tfoot> 元素用于对 HTML 表格中的表注(页脚)内容进行分组。

    4、thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时,您也许希望拥有一个标题行,一些带有数据的行,以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时,表格的表头和页脚可被打印在包含表格数据的每张页面上。

    查看全部
  • 1、<thead>标签表示表格头部,一般放<tr>和<th>标签。

    2、<tbody>标签表示表格内容,一般放<tr>和<td>标签。

    3、<tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。

    1、<thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

    2、<tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)

    3、<tfoot> 元素用于对 HTML 表格中的表注(页脚)内容进行分组。

    4、thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时,您也许希望拥有一个标题行,一些带有数据的行,以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时,表格的表头和页脚可被打印在包含表格数据的每张页面上。

    查看全部
  • 1111

    查看全部

举报

0/150
提交
取消
课程须知
没有任何WEB经验的WEB应用程序开发者、对WEB前端技术感兴趣的用户均可学习本教程。
老师告诉你能学到什么?
本教程代领大家轻松学习HTML(5)、CSS(3)样式基础知识,可以利用HTML(5)、CSS(3)样式技术制作出简单页面。
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!