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

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
  • 元素分类--块级元素 display:bloc将元素显示为块级元素. 如下代码就是将内联元素a转换为块状元素,从而使a元素具有块状元素特点。 a{display:block;} 块级元素特点: 1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(真霸道,一个块级元素独占一行) 2、元素的高度、宽度、行高以及顶和底边距都可设置。 3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。
    查看全部
  • p{ font-size:12px; color:red; font-weight:bold; } 使用CSS样式的一个好处是通过定义某个样式,可以让不同网页位置的文字有着统一的字体、字号或者颜色等。 font-size:20px;/*设置文字字号*/ color:red;/*设置文字颜色*/ font-weight:bold;/*设置字体加粗*/
    查看全部
  • 使用下拉列表框进行多选 下拉列表也可以进行多选操作,在<select>标签中设置multiple="multiple"属性,就可以实现多选功能,在 widows 操作系统下,进行多选时按下Ctrl键同时进行单击(在 Mac下使用 Command +单击),可以选择多个选项 <select multiple="multiple">
    查看全部
    0 采集 收起

    2018-03-22

  • <address>标签,为网页加入地址信息
    查看全部
    0 采集 收起

    2018-03-22

  • 拉列表在网页中也常会用到,它可以有效的节省网页空间。既可以单选、又可以多选。 <form action="save.php" method="post" > <label>爱好:</label> <select> <option value="看书">看书</option> <option value="旅游">旅游</option> <option value="运动">运动</option> <option value="购物"selected="selected">购物</option> </select> </form>
    查看全部
  • <hr>标签,添加水平横线
    查看全部
  • 使用单选框、复选框,让用户选择 在使用表单设计调查表时,为了减少用户的操作,使用选择框是一个好主意,html中有两种选择框,即单选框和复选框,两者的区别是单选框中的选项用户只能选择一项,而复选框中用户可以任意选择多项,甚至全选。请看下面的例子: 语法: <input type="radio/checkbox" value="值" name="名称" checked="checked"/> 1、type: 当 type="radio" 时,控件为单选框 当 type="checkbox" 时,控件为复选框 2、value:提交数据到服务器的值(后台程序PHP使用) 3、name:为控件命名,以备后台程序 ASP、PHP 使用 4、checked:当设置 checked="checked" 时,该选项被默认选中 注意:同一组的单选按钮,name 取值一定要一致,比如上面例子为同一个名称“radioLove”,这样同一组的单选按钮才可以起到单选的作用。
    查看全部
  • 要想输入空格,必须写入&nbsp;。
    查看全部
  • 在html文本中想输入回车换行,就必须输入<br />。
    查看全部
  • 文本域,支持多行文本输入 当用户需要在表单中输入大段文字时,需要用到文本输入域。 语法: <textarea rows="行数" cols="列数">文本</textarea> 1、<textarea>标签是成对出现的,以<textarea>开始,以</textarea>结束。 2、cols :多行输入域的列数。 3、rows :多行输入域的行数。 4、在<textarea></textarea>标签之间可以输入默认值。 举例: <form method="post" action="save.php"> <label>联系我们</label> <textarea cols="50" rows="10" >在这里输入内容...</textarea> </form>
    查看全部
  • 文本输入框、密码输入框 语法: <form> <input type="text/password" name="名称" value="文本" /> </form> 1、type: 当type="text"时,输入框为文本输入框; 当type="password"时, 输入框为密码输入框。 2、name:为文本框命名,以备后台程序ASP 、PHP使用。 3、value:为文本输入框设置默认值。(一般起到提示作用)
    查看全部
  • 浮动模型 块状元素这么霸道都是独占一行,如果现在我们想让两个块状元素并排显示,怎么办呢?不要着急,设置元素浮动就可以实现这一愿望。任何元素在默认情况下是不能浮动的,但可以用CSS定义为浮动,如div、p、table、img等元素都可以被定义为浮动。如下代码可以实现两个div元素一行显示。 div{ width:200px; height:200px; border:2px red solid; float:left; } <div id="div1"></div> <div id="div2"></div> 效果图 ┏━━━━━━━━━━━━━━━━┓ ┃┌───┬───┐ ┃ ┃│ │ │ ┃ ┃│   │   │ ┃ ┃└───┴───┘ ┃ ┗━━━━━━━━━━━━━━━━┛ 当然你也可以同时设置两个元素右浮动也可以实现一行显示。 div{ width:200px; height:200px; border:2px red solid; float:right; } 效果图 ┏━━━━━━━━━━━━━━━━┓ ┃ ┌───┬───┐┃ ┃ │   │   │┃ ┃ │   │   │┃ ┃ └───┴───┘┃ ┗━━━━━━━━━━━━━━━━┛ 又有小伙伴问了,设置两个元素一左一右可以实现一行显示吗?当然可以: div{ width:200px; height:200px; border:2px red solid; } #div1{float:left;} #div2{float:right;} 效果图 ┏━━━━━━━━━━━━━━━━┓ ┃┌───┐ ┌───┐┃ ┃│   │ │   │┃ ┃│   │ │   │┃ ┃└───┘ └───┘┃ ┗━━━━━━━━━━━━━━━━┛
    查看全部
  • 使用提交按钮,提交数据 在表单中有两种按钮可以使用,分别为:提交按钮、重置。这一小节讲解提交按钮:当用户需要提交表单信息到服务器时,需要用到提交按钮。 语法: <input type="submit" value="提交"> type:只有当type值设置为submit时,按钮才有提交作用 value:按钮上显示的文字
    查看全部
  • 3、百分比 p{font-size:12px;line-height:130%} 设置行高(行间距)为字体的130%(12 * 1.3 = 15.6px)。
    查看全部
    0 采集 收起

    2015-02-05

  • 引用别人的话<q></p>
    查看全部
    0 采集 收起

    2018-03-22

举报

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

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