设为首页 加入收藏

TOP

HTML概述(二)
2019-09-23 11:17:45 】 浏览:92
Tags:HTML 概述
;
meta name='keywords' content='HTML CSS java script'><!--网站关键字--> 4 <meta name='author' content='ren'><!--网站作者--> 5 <meta name="description" content="What is this website about?" /><!--网站描述--> 6 </head>

  3,HTML实体

  在HTML中,许多字符是预留的,比如大于>和小于<,浏览器将把它当做标签的一部分,而不是要向用户展示的字符。

所以,如果我们要向用户展示这两个符号,我们应该这样:&lt;(小于)&gt;(大于)。“&”开头,“;”结尾,中间是英文字母。

  由于HTML把空字符完全解读为英文单词分隔符,所以无论我们在编译器中输入多少空格或回车来隔开两个字符,它在浏览器最终只会呈现出一个空格。

1 <p>h    e    l    l    o</p>
2 
3 <!--终端呈现永远是:h e l l o-->

  所以要想在页面呈现伛个空格,请使用HTML实体:&nbsp;

1 <p>h&nbsp;&nbsp;&nbsp;&nbsp;e&nbsp;&nbsp;&nbsp;&nbsp;l&nbsp;&nbsp;&nbsp;&nbsp;l&nbsp;&nbsp;&nbsp;&nbsp;o<p>
2 
3 <!--最终呈现:h    e    l    l    o-->

  更多HTML实体请参考:https://www.w3school.com.cn/tags/html_ref_entities.html

 

三  HTML语义化

  语义化的含义就是用合理的、正确的标签来展示HTML结构和内容。语义化的优点如下:

    易于用户阅读,样式丢失的时候能让页面呈现清晰的结构。

    有利于SEO,搜索引擎根据标签来确定上下文和各个关键字的权重。

    方便其他设备解析,如盲人阅读器根据语义渲染网页

  HTML提供了很多语义标签,用于呈现网页不同类型的内容(一下是H5新增的)。

标签 描述
<article> 定义文章。
<aside> 定义页面内容以外的内容。
<details> 定义用户能够查看或隐藏的额外细节。
<figcaption> 定义 <figure> 元素的标题。
<figure> 规定自包含内容,比如图示、图表、照片、代码清单等。
<footer> 定义文档或节的页脚。
<header> 规定文档或节的页眉。
<main> 规定文档的主内容。
<mark> 定义重要的或强调的文本。
<nav> 定义导航链接。
<section> 定义文档中的节。
<summary> 定义 <details> 元素的可见标题。
<time> 定义日期/时间。

  有了这些语义元素,我们就可以简洁方便的呈现出结构化的内容。既利于用户阅读,也利于我们后期维护。

  1,结构

  我们在编写一份HTML文档时,它(body标签内)的结构应该大致如下。

 

   2,内容

  不同的内容应该使用不同的标签。不能和以前一样,大量使用div和span替代。

  比如,文章标题应该是用h1--h6,而不能用<span>或<p>标签,再简单的把文字加粗和放大;表示强调的词语或句子应该使用<em>,而不是用<span>,再对他使用斜体字样式。

 

关于常用的HTML知识,相对来说比较简单也比较少,对这部分知识,大家可以在W3School上花一个星期左右时间学习和练习。

首页 上一页 1 2 下一页 尾页 2/2/2
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇纯css耍个透明正方体转一转 下一篇不用JS,教你只用纯HTML做出几个..

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目