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

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
  • footer标签,用来定义底部区域。

    查看全部
  • <header>标签定义头部区域

    查看全部
  • <div> 把一些独立的逻辑部分划分出来

    查看全部
  • <div> 把一些独立的逻辑部分划分出来

    查看全部
  • <div> 划分 独立逻辑

    查看全部
  • <div> 划分独立逻辑

    查看全部
  • <hx>标签来制作文章的标题。

    查看全部
  • <span> 设置单独的样式

    查看全部
  • <p>我的第一个段落。</p> 每个段落一个p

    查看全部
  • <!--注释文字 -->

    查看全部
  • 选择器的优先级依次是: 内联样式 > id选择器 > 类选择器 > 标签选择器 > 通配符选择器

    <style type="text/css">

        #box {

         color:red;

        }

        .dv {

            color:blue;

        }

        div{

            color:black;

        }

        *{

            color:green;

        }

        </style>

    </head>

    <body>

        <div id="box" class="dv" >

            我是一个div

        </div>

    </body>

    优先级:orange > red > blue > black > green

    查看全部
  • 5e91834a000161cc06140254.jpg

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

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

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

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

    <body>    <h3>成绩表</h3>    <hr>    <table border="1">    <thead>       <tr>           <th>科目</th>           <th>分数</th>        </tr>    <tbody>        <tr>            <td>语文</td>            <td>99</td>        </tr>        <tr>            <td>数学</td>            <td>60</td>        </tr>    <tfoot>        <tr>            <td>总分</td>            <td>159</td>        </tr></body>
    查看全部
  • <form    method="post"   action="save.php">
            <label for="username">用户名:</label>
            <input type="text" name="username" />
            <label for="pass">密码:</label>
            <input type="password" name="pass" />
    </form>

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

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

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

    注意:

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

    查看全部
  • 不可继承的:display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、page-bread-before和unicode-bidi。(注:基本上什么盒子外边距、内边距,还有定位什么的是不能被继承的)
    所有元素可继承:visibility和cursor。
    内联元素可继承:letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。
    终端块状元素可继承:text-indent和text-align。
    列表元素可继承:list-style、list-style-type、list-style-position、list-style-image。
    表格元素可继承:border-collapse。

    查看全部
  • css元素 大体分为块状元素,内联元素(行内元素),内联块状元素

    内联元素特点:

       1.和其他元素都在一行上,

        2.元素的高度,宽度及顶部和底部边距不可设置

        3.元素的宽度就是它,包含的文字或者图片的宽度,不可改变

    块状元素的特点:

        1.

    查看全部
  • 5-5的<thead><tbody><tfood>和前一章表格比有什么作用?

    相同点在于:二者所做的事都是在定义表格。

    不同点在于:1、<thead><tbody><tfoot>是语义化的标签。

                        2、打个比方,如果数据量大,且表格底部是总计行,用<thead>                                     <tbody><tfoot>可以让总计行保持在底部显示,独立于<tbody>,                           避免要滚动到表格的底部(区别前面说的底部,前面所说的是“显示                           的底部”)才能看到总计行的情况。

    查看全部
  • 5-5的<thead><tbody><tfood>和前一章表格比有什么作用?

    相同点在于:二者所做的事都是在定义表格。

    不同点在于:1、<thead><tbody><tfoot>是语义化的标签。

                        2、打个比方,如果数据量大,且表格底部是总计行,用<thead>                                     <tbody><tfoot>可以让总计行保持在底部显示,独立于<tbody>,                           避免要滚动到表格的底部(区别前面说的底部,前面所说的是“显示                           的底部”)才能看到总计行的情况。

    查看全部
  • 5-5的<thead><tbody><tfood>和前一章表格比有什么作用?

    相同点在于:二者所做的事都是在定义表格。

    不同点在于:1、<thead><tbody><tfoot>是语义化的标签。

                        2、打个比方,如果数据量大,且表格底部是总计行,用<thead>                                     <tbody><tfoot>可以让总计行保持在底部显示,独立于<tbody>,                           避免要滚动到表格的底部(区别前面说的底部,前面所说的是“显示                           的底部”)才能看到总计行的情况。

    查看全部
  • section>定义区段


    <div>: 将内容分为块的时候用 ,或者是包裹任意内容的时候。语义化不是很明显(就是使用的界限不是很明显,很多场合都适用).

    <section>: 将块的内容分成节的时候用,通常 section 里面是包含 h 标题和内容结构的。而且<div> 和 <section>通常是嵌套使用。

    http://img1.sycdn.imooc.com//6109f85400011cd205000393.jpg

    查看全部
  • <hr>水平分割线

    &nbsp;  空格

    查看全部
  • 三种链接方式的优先级

    内联式 > 嵌入式 > 外部式

    嵌入式>外部式有一个前提:嵌入式css样式的位置一定在外部式的后面。如右代码编辑器就是这样,<link href="style.css" ...>代码在<style type="text/css">...</style>代码的前面(实际开发中也是这么写的)。

    总结:就近原则(离被设置元素越近优先级别越高,但前提是内联式、嵌入式、外部式样式表中css样式是在相同权值的情况下

    查看全部
  • <link href="base.css" rel="stylesheet" type="text/css" />

    注意:

    1、css样式文件名称以有意义的英文字母命名,如 main.css。

    2、rel="stylesheet" type="text/css" 是固定写法不可修改

    3、<link>标签位置一般写在<head>标签之内。

    查看全部
  • style加type="text/css"和不加type="text/css"有啥区别呀?

    告诉浏览器,这段标签内包含的内容是css或text;
    也就是说如果某种浏览器(特别是wap等手机浏览器械、)不能识别css的,会将代码认为text,从而不显示也不报错。

    查看全部

举报

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

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