HTML和CSS的基础知识----------2019-10-09

                         前端知识点


1、一个最基本的HTML页面:

<!DOCTYPE html>

<html>

<head>

         <meta charset="UTF-8">

         <title>网页标题</title>

</head>

<body>

           <h1>网页正文</h1>

</body>

</html>

2、  标签:

    HTML中的标记指的就是标签。

•  HTML使用标记标签来描述网页。

•  结构:

        <标签名>标签内容</标签名>

        <标签名 />

3、元素:

             我们还将一个完整的标签称为元素。

            这里我们可以将元素和标签认为是一个同义词。

               <h1>一级标题</h1>

             上边的h1我们就称为元素

              <p>我是一个<em>段落</em></p>

              p也是一个元素,em是p的子元素,p是em的父元素。

             <body>

                         <p><em>内容</em></p>

             </body>

             body也是一个元素。

             body是p和em的祖先元素。

             p和em是body的后代元素。

4、属性:

              可以为HTML标签设置属性。

              通过属性为HTML元素提供附加信息。

               属性需要设置在开始标签或自结束标签中。

               属性总是以名称/值对的形式出现。

                比如:name=“value”

               有些属性可以是任意值,有些则必须是指定值。

               <h1 title="我是一个标题">标题</h1>

               <img src="" alt=""  />

     常见属性:

                 id:– id属性作为标签的唯一标识,在同一个网页中不能出现相同的id属性值。

                class:– class属性用来为标签分组,拥有相同class属性的

标签我们认为就是一组,可以出现相同的class属

性,可以为一个元素指定多个class。

                title:– title属性用来指定标签的标题,指定title以后,鼠标移入到元素上方时,会出现提示文字。

5、注释:

              HTML注释中的内容不会在网页中显示。

              格式:    <!-- 注释内容 -->

              注释不能嵌套!

6、html5文档声明:

                        <!DOCTYPE html>

7、怪异模式:

                – 标准模式(Standards Mode)

                – 怪异模式(Quirks Mode)

8、解决乱码问题:

          在html5中只需要使用meta标签即可完成这个任务:

                      <meta charset="utf-8" />

         meta的用法:

                设置页面的字符集 : <meta charset="utf-8">

                设置网页的描述:<meta name="description" content="">

                设置网页的关键字:<meta name="keywords" content="">

               请求的重定向: <meta http-equiv="refresh" content="5;url=地址"/>

9、常用标签:

<html>  标签

       作用:– <html>标签用于告诉浏览器这个文档中包含的信息是用HTML编写的。

        用法:– 所有的网页的内容都需要编写到html标签中,一个页面中html标签只能有一个。

                   – html标签中有两个子标签head和body 。

<head>   标签

           作用:– <head>标签用来表示网页的元数据,head中包含了浏览器和搜索引擎使用的其他不可见信息。

           用法:– head标签作为html标签的子元素的出现,一个网页中只能有一个head。

<title>   标签

             作用: <title>标签表示网页的标题,一般会在网页的标题栏上显示。

                      -title标签中的文字,是页面优化的最重要因素。在搜索引擎的搜索时最先看到的、最醒目的内容。

             用法:– 建议将title标签紧贴着head标签编写,这样搜索引擎可以快速检索到标题标签。

                       – 网站中的多个页面的title也不应该重复,这样不利于搜索隐藏检索。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,036评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,046评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,411评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,622评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,661评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,521评论 1 304
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,288评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,200评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,644评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,837评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,953评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,673评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,281评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,889评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,011评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,119评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,901评论 2 355

推荐阅读更多精彩内容

  • HTML基础 本文包括 HTML基本知识与结构 HTML常见标签 标签写法与嵌套的讨论 HTML、CSS、java...
    廖少少阅读 2,085评论 2 21
  • 任务一:课程简介 任务二:学习内容简介 我们主要学习哪些内容? 根据W3C标准,一个网页主要由三部分组成:结构、表...
    我是阿喵酱阅读 256评论 0 1
  • 浏览器与服务器的基本概念 浏览器(安装在电脑里面的一个软件) 作用: ①将网页内容渲染呈现给用户查看。 ②让用户通...
    云还灬阅读 1,118评论 0 0
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 3,888评论 0 0
  • 概述 在网易云课堂学习李南江老师的《从零玩转HTML5前端+跨平台开发》时,所整理的笔记。笔记内容为根据个人需求所...
    墨荀阅读 2,337评论 0 7