【学习】HTML基础入门(一)

HTML基础(一)

本文参考了[http://www.w3school.com.cn/html/][6]


HTML简介

什么是HTML

  • HTML(Hyper Text Markup Language)是描述网页的语言

HTML标签

  • 所有的内容都是放在标签内部的
  • 用两个尖括号及其内部的标签名表示标签
  • <html> </html>
  • 一般情况要有开始和结束标签

编辑器

  • 记事本也可以写html,只要保存时选择.html的格式即可以
  • 一般的编辑器都可以编写,好的编辑器可以自动补全

固定格式

  • 基本上所有的html都是由以下主干扩充的
        <html>
            <head>

            </head>
            <body>

            </body>
        </html>
  • 结束标签一定要写,虽然有的浏览器即使没有结束标签也能正常显示

基本元素

  • 标题
        <h1>标题1最大</h1>
        <h2>标题2</h2>
        <h3>标题3</h3>
        <h4>标题4</h4>
        <h5>标题5</h5>
        <h6>标题6最小</h6>
  • 段落
        <p>段落</p>
  • 水平分割线 
    这是少有的没有结束符的(开始符合结束符在一起)的标签
        <hr />
  • 注释
        <!-- 注释 -->
  • 拆行
        <p>这是<br />分开的<br />段落</p>
  • 样式
        <h2 style="样式=背景色:红色</h2>
        <h2 style="font-family:verdana">样式=字体:verdana</h2>
        <h2 style="font-size:10px">样式=大小:10像素</h2>
        <h2 style="color:red">样式=颜色:红色</h2>
        <h2 style="text-align:center">样式=对齐方式:居中</h2>
        <h2 style="font-size:10px;color:red">样式之间可以用分号隔开</h2>
  • 文本格式化
        <b>文字加粗(以下均没有自动换行)</b>
        <br />
        <big>文字变大</big>
        <br />
        <small>文字变小</small>
        <br />
        <em>文字斜体</em>
        <br />
        可以单独写一个没有标签的文字
        <sub>下角标</sub>
        <sup>上角标</sup>
  • 预格式文本
        <pre>
        预格式文本
            保留了    空格
        与换行
        很适合显示代码等文本
        </pre>
  • 地址描述
        <address>
            Written by jbw<br />
            你要是非问他和普通的斜体有什么不同<br />
            我觉得应该是要规范要求吧<br />
            这里同样是不带自动回车的
        </address>
  • 引用
        <p>长引用</p>
        <blockquote>这是一段长引用,长引用会自动形成一段,同时有首行缩进。这是一段长引用,长引用会自动形成一段,同时有首行缩进。</blockquote>

        <p>短引用</p>
        <q>短引用会自动被引号引起来</q>
  • 删除文字与插入文字效果
        <p>正常文字 <del>中间有删除线的文字</del> <ins>有下划线的插入文字</ins> 正常文字</p>
  • 缩写
        <abbr title="这是缩写的全称">这是缩写,下面带了一行小点点</abbr>
        <p title="这是缩写的全称">这是缩写</p>
  • 超链接
        <a href="http://www.baidu.com">文字链接</a>
        <a href="http://www.baidu.com">右面的图片是链接<img border="0"src="C:\Users\bwjiang\Desktop\photo.jpg" /></a>
  • 插入图片
        <img src="C:\Users\bwjiang\Desktop\photo.jpg" alt="当浏览器没有显示出图片时,显示本段文字"/>
原文地址:https://www.cnblogs.com/bwjiang/p/7838394.html