前端html笔记注意事项

一、关键字和页面描述

  • 设置页面描述

<meta name=" " content=" " />
<meta name="Description" content="网易是中国领先的互联网技术公司,为用户提供免费邮箱、游戏、搜索引擎服务,开设新闻、娱乐、体育等30多个内容频道,及博客、视频、论坛等互动交流,网聚人的力量" />

2981395-3aac42c1e88bf23a.png
image.png

只要设置的 Description页面面熟,那么百度搜索结果,就能够显示这些语句,这个技术叫做 SEO,search engine optimization,搜索引擎优化。

  • 定义关键词:

<meta name="Keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信" />
这些关键词,就是告诉搜索引擎,这个网页是干嘛的,能够提高搜索命中率。让别人能够找到你,搜索到你。

<meta name="Keywords" content="词,词" />
<meta name="Description" content="页面描述" />

二、标签

  • <h1></h1> 一级标题

HTML标签是分等级的,HTML将所有的标签分为两种:容器级、文本级
顾名思义,容器级的标签,里面可以放置任何东西;文本级的标签里面,只能放置文字、图片、表单元素。
h标签没有嵌套关系的。h是容器级的标签。理论上里面可以放置p、ul,只是法律上的允许,在语义上,不要这么写。

  • p标签

p是一个文本级的标签,p里面只能放文字、图片、表单元素。

正确写法
<h3>个人经历</h3>
    <p>
        Angelababy从小怎么怎么样
    </p>
  • <img/>

自封闭标签,也称为单标签。原因很简单,如果是对儿,里面就要有内容,表示给这个内容增加语义。图片就是一个图片,不需要给什么文字增加语义,所以就是自己一个人活得挺好。meta也是自封闭标签。

<img />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

<img src="../../shizi.jpg" alt="照片" />

alt是英语alternate“替代”的意思,就表示不管因为什么原因,当这个图片无法被显示的时候,出现的替代文字(有的浏览器不支持)。

<img src="路径" alt="替代文本,当图片不能显示的时候,显示这里的文字" />
<img src="images/a/0.png" alt="" />
<img src="../../0.png" alt="" />
  • 超级链接a标签

a标签属性title 悬停文本

<a href="09_img.html" title="很好看哦">结婚照</a>

2981395-600766a319b8212b.png
image.png
target="_blank"是否在新窗口中打开

<a href="1.html" title="悬停文本" target="_blank">链接的内容</a>
blank就是“空白”的意思,就表示新建一个空白窗口。为毛有一个_ ,就是规定。也就是说,如果不写target="_blank"那么就是在相同的标签页打开,如果写了,就是在新的空白标签页中打开。
页面内的锚点属性
锚点用name属性来设置,一个a标签如果name属性(或者id属性),那么就是页面的一个锚点。

<a name="wdzp">我的作品</a>
或者:
<a id="wdzp">我的作品</a>

1.html#wdzp
<a href="#wdzp">点击我就查看我的作品</a>

 `a是一个文本级的标签如一个段落中的所有文字都能够被点击,那么应该p包裹a:`

<p>
<a href="">段落段落段落段落段落段落</a>
</p>


猜你喜欢

转载自blog.csdn.net/weixin_34342207/article/details/88280097