乐趣区

关于前端:HTML和CSS的第一天

HTML 框架和标签

一. 框架

1. 设置网站图标

<link rel="shortcut icon" href="图片链接"  type="image/png">

2. 设置网站搜寻的关键词和网站的形容内容

<meta name="keywords" content="关键词">
<meta name="description" content="形容内容">

3. 书写脚本

<script>
.....
</script>

4. 书写款式

<style>
...
</style>
或
<link rel="stylesheet" href="款式门路">

二. 标签

1. 布局标签

<div>
...
</div>

2. 换行标签

<br />

3. 显示水平线标签

<hr>

4. 链接标签

<a href="跳转网址" title="提醒内容"> 跳转提醒 </a>
<a href="跳转网址" title="提醒内容" target="_blank"> 跳转提醒 </a>(减少一个页面)<a href="跳转网址" title="提醒内容" target="_self"> 跳转提醒 </a>(在原页面根底上再关上一个页面)

5. 图片显示

<img src="图片链接" title="提醒内容" alt="当图片无奈显示时的代替内容">

6. 列表
ul/ol: 无序 / 有序

ul>li{li$}*3:<ul>
<li>li1</li>
<li>li2</li>
<li>li3</li>
</ul>

成果:

ol>li{li$}*3:<ol>
<li>li1</li>
<li>li2</li>
<li>li3</li>
</ol>

成果:

三. 文本格式化标签

1. 加粗和强调(行级标签,不会独占一行)

<b></b>: 加粗
<strong></strong>: 加粗和强调(便于在应用 SEO 时,提取关键词)

2. 歪斜和强调

<i></i>: 歪斜
<em></em>: 歪斜和强调

3. 放大一号和加大一号(行级标签,不会独占一行)

<small></small>: 放大一号
<big></big>: 加大一号(在 HTML5 中被淘汰了,少用)

4. 设置上标和下标

X<sub>1</sub>: 下标
X<sup>1</sup>: 上标

成果:

5. 短文本援用

<q></q>

6. 地址信息

<address></address>

四. 实体本义符

5. 块级元素和行级元素

块级元素:=display:block
独占一行
可蕴含块级和行级元素

行级元素:=display:inline
不独占一行
只能蕴含行级元素

<p  dispaly:inline></p>: 块级转化行级
<span  dispaly:block></span>: 行级转化块级
退出移动版