html学习第一期

Posted 别碰我的宏定义

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html学习第一期相关的知识,希望对你有一定的参考价值。

html第一话:html部分快捷键和大致轮廓

<!DOCTYPE html>
<html lang="en">
<!--lang= "en" lang = "zh" 表示使用语言 "en"表示英语 "zh"表示中文-->
<head>
    <meta charset="UTF-8">
<!--    charset="UTF-8"表示编码格式-->
    <title>Title</title>
<!--    <title>"网页标题"</title>-->
</head>
<body>
<p>hahaha</p>
<!--p为段落符-->
</body>
</html>
<!--1、设置字体大小颜色背景 setting -color Scheme&ndash;&gt;-->
<!--2、重命名---右击文件---rename-->
<!--3、删除文件---delete-->
<!--修改关键字颜色&#45;&#45;setting -color Scheme&ndash;&gt;-->
<!--修改长换行 setting -General&ndash;&gt;-->
<!--统一编辑按住alt,点击一次选中,点击两次取消-->
<!--一行,鼠标在当前行,ctrl + /
注释多行,选中多行, ctrl + shift+ /-->
<!--包含关系-->
<!--ctrl + d 撤销-->
<!--ctrl + a 全选-->
<!--CTRL + x 剪贴-->
<!--ctrl + o 打开文件-->
<!--ctrl + n 新建-->
<!--超文本标记语言-->

html第二话:p标签,li标签,div壳子,h标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>内容</title>
</head>
<body>
<!---->
<h1> 哈哈哈哈哈</h1>
<h1>哈哈哈哈哈</h1>
<p aria-setsize="18"> 段落1 </p>
<p> 段落2</p>
<p> 段落3</p>
<p> 段落4</p>
<p> 段落5</p>
<div>
  <p>
    你好
  </p>
</div>
<!--<p>段落10</p> 元素指从开始标签到结束标签之间的所有内容-->
<!--元素的开始    元素内容    元素结束-->

<p> 段落10</p>
<li>你好</li>
<!--
1、html HyperText MarkUp Language超文本标记语言
2、html的作用
写页面结构内容(网页中的信息),例如图片、文字、按钮等

3、文件后缀
.html 或者 .htm

4、html 不区分大小写,建议小写

5、HTML 是由浏览器执行的
<p> 段落</p>
<关键词>

6、标签 标记
尖括号包含的关键词
HTML由标签组成

双标签   封闭类型标签  <title> 内容  </title>
                     开始标记   结束标记
但标签   非封闭类型标签 空标记 <meta/>
一个标签可以有多个属性  用空格隔开  多个属性不区分顺序
注意嵌套顺序
-->
<h1>我的第一个标题</h1>
<p>我的第一个段落</p>
</body>
</html>

html第三话:网页跳转和部分标签

<!DOCTYPE html>
<html lang="en">
<head>
    <style type="css">
        /*CSS样式*/
    </style>
    <scrip>
        /*javascript代码*/
    </scrip>
    <meta charset="UTF-8">
    <meta name="keywords" content="绿叶学习网,前端开发"/>
    <meta name="description" content="web技术学习"/>
    <meta name="author"  content="helicopter"/>
    <meta name="copyright" content="版权所有禁止转让"/>
    <meta http-equiv="refresh" content="10;url=http://www.baidu.com" charset="utf-8">

    <title>绿叶学习网</title>
<!--  网页标题标签-->
</head>
<body>
<h1>这个页面在10秒后自动跳转到百度</h1>
<!--head = h 网页标题标签 h1 ~ h6 1号最大 6号最小 逐级递减
打开控制台
F12
Fn + F12
ctrl + F12-->

<!--<h2 align=" left / center /right">一号标签</h2>-->
<h3 align="left">二号标签</h3>
<h4 align="center">三号标签</h4>
<h5 align="eight">四号标签</h5>
<hr color = "blue"  size="10px" align="left">
<hr color = "black"  size="10px" align="left"/>
<!--width = "" 长度 size = "" 宽度 大小都是px默认不写也可以写-->
<!--<h6>五号标签</h6> 默认靠左加粗 双标记加在开始标签里面, 但标记加载/后边-->
<h7>七号标签</h7>
<!--2、段落标记-->
<p>这是br这是br一个段落</p>
<!--<hr>水平线-->
<hr/>
<p align="center">这是一个段落</p>
<p align="left">这是一个段落</p>
<br>
<br>
<p>这是一个
  <br>
  段落</p>
</body>
<body>
    <h3 align="center">静夜思</h3>
    <p align="center">窗前明月光,疑是地上霜</p>
    <p align="center">巨头望明月,低头思故乡</p>
</body>
</html>

html第四话:加粗斜体,删除线,下划线

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="refresh" content="10,url=http://www.baidu.com">
    <title>粗体标签</title>
</head>
<body>
  <p>这是普通文本</p>
  <strong>这是粗体文本</strong>
  <div>
  <strong>
      <i>
          这是加粗斜体文本
      </i>
      <em>
          这也是加粗斜体文本
      </em>
      <cite>
          这是第三种加粗斜体文本
      </cite>
      <p aria-setsize="18px" align="center">
          <strong>
              <i>
                  (a+b)<sup>2</sup> = a<sup>2</sup> + b<sup>2</sup>+2ab
                  <br>
                  H<sub>2</sub>so<sub>4</sub>指的是硫酸
              </i>
          </strong>
      </p>
      <body>
        <p align="center">
            新西兰花
        </p>
        <p align="center">
            <s>
                原价:¥4.00
            </s>
        </p>
        <p align="center">
            <strong>
                <i>
                    <u>
                        现价:¥3.00
                    </u>

                </i>
            </strong>
        </p>
      </body>
  </strong>
  </div>
  <br>
  <div>
      <b>这是粗体文本</b>
  </div>
</body>
</html>

以上是关于html学习第一期的主要内容,如果未能解决你的问题,请参考以下文章

程序猿学习创业《第一期》

学习日记day 10 : JavaScript秋风扫落叶第一期

python画一片绿叶给你

ZooKeeper学习第一期---Zookeeper简单介绍

ZooKeeper学习第一期---Zookeeper简单介绍

ZooKeeper学习第一期---Zookeeper简单介绍