美文网首页
HTML 5 自学第二天

HTML 5 自学第二天

作者: 吃屁的小栗子 | 来源:发表于2017-11-02 10:27 被阅读1次

    这几天找到了腾讯视频—极客学院的精品课的视频 传送门
    把这几天学到的东西总结,记录一下。

    <!DOCTYPE html>
    <html lang="en">
    <!--头-->
    <head>
    <meta charset="UTF-8">
    <title>CJLLearnHTML5</title>
    <style>样式</style>
    <link rel = "stylesheet" type = "text/css" href = "mystyle.css">
    
    <style type = "text/css">
        body{background-color: red }
        p{margin-left: 50px}
    </style>
    
    </head>
    <!--身子(内容)-->
    <body bgcolor="aqua">
    
    <!--h 标题标签-->
    <h1 align="center">h1 标题</h1>
    <h2 class="h2 class">h2 标题</h2>
    <h3 id="H3 id">h3 标题</h3>
    <h4>h4 标题</h4>
    <h5>h5 标题</h5>
    <h6>h6 标题</h6>
    <!--段落标签-->
    <p>第一次制作一个网页</p>
    <!--超链接标签 blank额外页打开-->
    <a href="https://www.baidu.com" target="_blank">
    ![](images/41.png)
    百度超链接
    </a> <br/>
    
    <a name="tips"> hello </a>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <a href="#tips"> 跳转到hello</a> <br/>
    <!--图片标签-->
    ![](images/1.jpg) <br/>
    <!--换行标签 间距不同-->
    Hello World <br/>
    hello world
    
    <!--HTML 元素-->
    <!--元素是指开始标签到结束标签的所有代码-->
    <!--元素的内容是开始标签和结束标签之间的内容-->
    <!--空元素在开始标签中关闭-->
    <!--大多数HTML元素可拥有属性-->
    <!--大多数标签支持嵌套-->
    
    <!--HTML 属性-->
    <!--标签可以拥有属性为元素提供更多信息-->
    <!--属性以键值对的形式出现-->
    <!--如: href="https://www.baidu.com"-->
    <!--常用标签属性-->
    <!--<h1>align 对齐方式</h1>-->
    <!--<body>bgcolor 背景颜色</body>-->
    <!--<a>target 规定在何处打开超链接</a>-->
    <!--通用属性-->
    <!--class :规定元素的类名-->
    <!--id    :规定元素唯一id-->
    <!--style :规定元素的样式-->
    <!--title :规定元素的额外信息-->
    
    <!--HTML格式化-->
    <b>加粗</b> <br/>
    <big>大号文字</big> <br/>
    <em>着重文字</em> <br/>
    <i>斜体字</i> <br/>
    <small>小号字</small> <br/>
    <strong>加重语气</strong> <br/>
    下标<sub>下标</sub>下标 <br/>
    上标<sup>上标</sup>上标 <br/>
    <ins>插入字</ins> <br/>
    <del>删除字</del> <br/>
    
    
    <!--HTML样式-->
    <!--1.标签-->
    <!--<style>样式定义-->
    <!--<link>样式引用-->
    <!--2.属性-->
    <!--rel = "stylesheet":外部样式表-->
    <!--type = "text/css":引入文档的类型-->
    <!--margin - left:边距-->
    
    <!--三种样式表插入方法-->
    <!--外部样式表-->
    <!--<link rel = "stylesheet" type = "text/css" href = "mystyle.css">-->
    <!--内部样式表-->
    <!--<style type = "text/css">-->
    <!--body{background-color: red }-->
    <!--p{margin-left: 50px}-->
    <!--</style>-->
    <!--内联样式表-->
    <!--<p style = "color: aqua">-->
    
    <!--HTML链接-->
    <!--1.连接数据-->
    <!--文本链接-->
    <!--图片链接-->
    <!--2.属性-->
    <!--href属性:指向另一个文档的链接-->
    <!--name属性:创建文档内的链接-->
    <!--3.img标签属性-->
    <!--alt:替换文本属性-->
    <!--width:宽-->
    <!--height:高-->
    </body>
    </html>
    

    下面是效果

    HTML1.gif

    相关文章

      网友评论

          本文标题:HTML 5 自学第二天

          本文链接:https://www.haomeiwen.com/subject/nphopxtx.html