1、认识HTML及标签

什么是HTML:超文本标记语言(HyperText Markup Language,简称 HTML); 

怎么学HTML :HTML 是一门标记语言,标记语言由一套标记标签组成,学习 HTML,其实就是学习标签 �;

HTML基本结构

<!DOCTYPE html>                     <!-- 文档类型 -->
<html>
<head>                              <!-- 网页头部 -->
    <meta charset="utf-8">          <!-- 国际编码 -->
    <title>html基本结构</title>     <!-- 网页标题 -->
</head>
<body>                              <!-- 网页主体 -->
    Hello
    <p>我是网页主体</p>
</body>
</html>

标题标签

<!--一个页面通常只出现一个h1标签有利于搜索引擎搜索-->
标题标签
<h1>我是h1标签</h1>
<h2 id="box">我是h2标签</h2>
<h3>我是h3标签</h3>             <!--id是唯一的,不可重复-->
<h4>我是h4标签</h4>
<h5>我是h5标签</h5>
<h6>我是h6标签</h6>
<h7>我是h7标签</h7>

单标签

<hr>        <!--hr水平线标签-->
<br>        <!--br换行标签-->

小于号:<       &lt;            
大于号:>       &gt;            
空格号:        亲&nbsp;爱         
空白位:        亲&emsp;爱    
& 字符:&        &amp;         
版权号:©        &copy; 
注册商标:®      &reg;       
TM: ™           &trade;

粗/斜体标签

<b>物理粗体标签</b><br>       <!--只是物理加粗-->   
<strong>粗体标签,有利于SEO搜索</strong><!--不仅能加粗,还有利于搜索引擎搜索-->

<h2>斜体标签</h2>
<i>物理斜体</i><br>             <!--斜体作用-->
<em>em斜体,有利于搜索</em> <!--强调斜体,利于搜索引擎搜索-->
<strong><em>啦啦啦</em></strong>

列表标签

<h3>无序列表</h3>
    <ul type="square">
        <li>1</li>
        <li>2</li>
    </ul>
    <!-- type
       disc  默认  小黑圆点
       circle  空心圆
       square  小方框
       -->
    <h3>有序列表</h3>
        <ol type='A' reversed start='3'>    <!--3-C-倒数第几个字母-->
            <li>A</li>
            <li>B</li>
        </ol>
    <!-- reversed   降序排序
             sorted     升序
             start      有序列表起始值
             -->
<h3>自定义列表</h3>
    <dl>
        <dt>标题</dt>
        <dd>E</dd>
        <dd>F</dd>
        <dd>G</dd>
    </dl>

图片标签

<img src="图片链接" alt="关键字,用于SEO">    

超链接a标签

<a href="图片链接">xxx</a>
<a href="http://www.baidu.com"" target='_self'>超链接>>>去百度</a><br>
<a href="#">#-刷新当前页面</a><br>
<a href="javascript:void(0);">死链接,没有反应</a><br>
<a href="#ss" name='xx'>跳转到顶部</a>
<!--
      只有拥有name属性的a标签才有锚点
      其他标签可以通过id属性实现锚点
      target属性
          _self 当前页面打开  默认
          _blank 在新窗口打开
      -->
HTMLclass/id书写规范
   1.名字用小写字母
   2.以英文开头,可以包含英文字母,数字,_,-,不能使用中文
   3.驼峰命名
       className  第二个单词首字母大写
   4.id命名
       id只能有一个名字,而且在页面中相同的名字只能出现一次,相当于身份证号码一样
   5.class命名
       class可以出现多次,而且相同的名字可以有多个,相当于人名一样

div+span

div:块状元素,独占一行。可以设置大小。可以通过修改display属性改变。
pan:行间元素,无法设置狂傲,大小由内容撑起。可以通过修改display属性改变。

个人笔记,便于日后查看。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,820评论 1 45
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,352评论 1 41
  • 序言 整理谷歌的小弟的笔记,版权归原作者所有,本文仅作整理,原文链接:http://blog.csdn.net/l...
    在代码下成长阅读 1,181评论 1 5
  • 学习目标: 了解常用浏览器 掌握WEB标准 理解标签语义化 掌握常用的排版标签 掌握常用的文本格式化图像链接等标签...
    淡淡疯阅读 1,278评论 0 3
  • 一不留神,娃又扯出这么一堆纸,玩得不亦乐乎,给她一包抽纸,就是整个世界,快乐的玩吧,健康长大!
    大连鱿鱼丝阅读 199评论 0 0