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

初识HTML(5)+CSS(3)-升级版

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
  • 当用户要在表单中键入字母、数字等内容时,就会用到文本输入框。文本框也可以转化为密码输入框。

    语法:

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

    1、type:  (text,password)

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

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

    还有number:数字

    url:网站连接

    email:邮箱

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

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

    举例:

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

           

    查看全部
  • <tr></tr>定义表格的行
    <th></th>
    <td></td>这两个人定义表格的列,th有加粗的效果,用来定义表头

    先定义行,在写列

    <tr>
    <td></td>
    <td></td>
    </tr>
    1、<thead>标签表示表格头部,一般放<tr>和<th>标签。
    2、<tbody>标签表示表格内容,一般放<tr>和<td>标签。
    3、<tfoot>标签标签表格脚部标注,一般放<tr>和<td>标签。
    查看全部
  • <ol>
    <li></li>
    <li></li>
    </ol>

    ol是有顺序的

    <ul>
    <li></li>
    <li></li>
    </ul>

    ul是无序的

    查看全部
  • 语义化就是:

    明白每个标签的用途(在什么情况下使用此标签合理)比如,网页上的文章的标题就可以用标题标签,网页上的各个栏目的栏目名称也可以使用标题标签。文章中内容的段落就得放在段落标签中等等

    section标签和div的区别就是section更具有语义化

    查看全部
  • <h3>成绩表</h3>

            <table border='1'>

                

                <thead>

                <tr><th>科目</th>

                    <th>分数</th>

                </tr>

                </thead>

                

                <tbody>

                <tr>

                    <td>语文</td>

                    <td>99</td>

                </tr>

                <tr>

                    <td>数学</td>

                    <td>60</td>

                </tr>

                </tbody>

                

                <tfoot>

                <tr>

                    <td>总分</td>

                    <td>159</td>

                </tr>

                </tfoot>

                </table>

    http://img1.sycdn.imooc.com//6364f699000175c105500667.jpg

    查看全部
  • 笔记一

    <img src = "myimage.gif" alt = "My Image" title = "My Image" />

    讲解:

    1、src:标识图像的位置;

    2、alt:指定图像的描述性文本,当图像不可见时(下载不成功时),可看到该属性指定的文本;

    3、title:提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本);

    4、图像可以是GIF,PNG,JPEG格式的图像文件。

    查看全部
  • 1. <!DOCTYPE html>:文档类型声明,表示该文件为 HTML5文件。<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前

    2. <html></html>标签对:<html>标签位于HTML文档的最前面,用来标识HTML文档的开始;</html>标签位于HTML文档的最后面,用来标识HTML 文档的结束;这两个标签对成对存在,中间的部分是文档的头部和主题。

    3.<head></head>标签对:标签包含有关HTML文档的信息,可以包含一些辅助性标签。如<title></title>,<link /><meta />,<style></style>,<script></script>等,但是浏览器除了会在标题栏显示<title>元素的内容外,不会向用户显示head元素内的其他任何内容。

    4.<body></body>标签对:它是HTML文档的主体部分,在此标签中可以包含<p><h1><br>等众多标签,<body>标签出现在</head>标签之后,且必须在闭标签</html>之前闭合。

    查看全部
  • 设置html样式

    查看全部
  • 标签与标签之间是可以嵌套的,但先后顺序必须保持一致,如:<div>里嵌套<p>,那么</p>必须放在</div>的前面。<div><p></p></div>
    查看全部
  • html>


    <head>

        <meta charset="UTF-8">

        <title>input-placeholder</title>

    </head>


    <body>

        <form method="post" action="save.php">

            <h2>账户:</h2> <input type="text" name="myName" placeholder="请输入用户名"/> 

           

            <h2>密码:</h2> <input type="password" name="psss" placeholder="请输入密码"/> 

        </form> 

         <h3>账号:</h3> <input type="text" placeholder="请输入用户名"/>

         

         <h3>密码:</h3><input type="password" placeholder="请输入用户名"/>

        <br/>

            <h4>验证码:</h4><input type="value" placeholder="输入验证码"/>

    查看全部
  • <!DOCTYPE html>

    <html>


    <head>

        <meta charset="UTF-8">

        <title>使用thead、tbody、tfoot标签</title>

    </head>


    <body>

        <h2>成绩表</h2><hr/>

        <h3><table border="1">

            <thead>

                <tr>

                    <th>科目</th>

                    <td>分数</td>

                </tr>

                </thead>

                <tbody>

                <tr>

                    <th>语文</th>

                    <td>99</td>

                </tr>

                </tbody>

                <tr>

                    <th>数学</th>

                    <td>60</td>

                </tr>

                <tfoot>

                <tr>

                    <th>总分</th>

                    <td>159</td>

                </tr>

                </tfoot>

                </table></h3>

                

    </body>


    </html>

    查看全部
  • 标题增加颜色等属性

    http://img1.sycdn.imooc.com//6356857f0001ed2603110170.jpg

    查看全部
  • <span>使用方法

    <style>
    <span>{
    color:red;
    }
    </style>
    
    <body>
    <span>
    xxxxx文本内容
    </span>
    
    </body>
    查看全部
  • &nbsp;  为空格
    查看全部
  • <br/>回车功能
    查看全部

举报

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

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