HTML之标签
一、HTML 标签
HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
•HTML 标签是由尖括号包围的关键词,比如 <html>
•HTML 标签通常是成对出现的,比如 <b> 和 </b>
•标签对中的第一个标签是开始标签,第二个标签是结束标签
•开始和结束标签也被称为开放标签和闭合标签
•HTML 文档描述网页
•HTML 文档包含 HTML 标签和纯文本
•HTML 文档也被称为网页
Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。浏览器不会显示 HTML 标签,而是使用标签来解释页面的内容。
综上所述。网站是由网页构成的,网页是由HTML(网页)元素构成的。HTML元素是由HTML标签描述的。HTML标签 通常成对儿出现。开始 元素内容 结束。
二、HTML 元素语法
•HTML 元素以开始标签起始
•HTML 元素以结束标签终止
•元素的内容是开始标签与结束标签之间的内容
•某些 HTML 元素具有空内容(empty content)
•空元素在开始标签中进行关闭(以开始标签的结束而结束)
三、HTML框架标签
<body>的几个属性:bgcolor背景色 background背景图片 text文本颜色
四、HTML基本标签
①格式标签 <font color="#663399" face="微软雅黑" size="">操作文字</font>
<b>字体加粗</b>
<i>倾斜</i>
<em>倾斜</em><!--更容易搜索到-->
<u>下划线</u><br>
<strong>字体加粗,强调语气</strong>
<center>居中</center>
<br/>换行
空格
<center>居中</center>
<!--我是标注标签-->
②内容标签
<h1>--<h6> 标题标签,其中好h1的字体最大,
<p>段落标签</p>
<div> 内容容器,网页布局用</div>
<span> 内容容器,区别在与DIV默认占一行,默认用多大空间占多大空间</span>
<ul>无序列表 里面的每一项用<li></li>
<ol>有序列表 里面的每一项用<li></li><br />
③常用标签:
超链接标签:<a href="http://www.baidu.com">这是一个超链接</a>
路径问题:手写路径怎么写
以该网页所在的位置为基础,如果找它的父级文件夹用../ 如果找它的子级文件夹用/ 直到找到图片为止
④ <a>标签中taget的属性:
_parent在父页面打开
_blank在新页面打开
_self在自身页面打开
_top在当前页面打开 ⑤ 图片标签
<img src="show.jpg" alt="雕金玫瑰" width="300" height="200" /> <!--高度和宽度设置一个即可,因为图片会按照比例缩放,alt是在图片无法加载时,显示的文字,还可帮助搜索引擎搜索到-->
注:有序列表与无序列表
1、有序列表(显示1、2、3、。。。)
<ol type="1"><!--从1这个序号开始,type后可以填数字、字母,写几从几开始-->
<li>路飞</li>
<li>娜美</li>
<li>山治</li>
</ol>
2.无序列表、无序列表(每列前显示一个黑点)
<ul>
<li>山治</li>
<li>路飞</li>
<li>乌索普</li>
</ul>
五、建立锚点
.设置锚点,在要设置锚点的地方加一个a标签<a name="md"></a> #是本页面意思
.设置跳转,在要跳转的地方加一个A标签<a href="#锚点名"></a>
3.设置跳转另一个页面,<a href="跳转页面的属性.html+#+name名"></a>
HTML之标签的更多相关文章
- a标签点击跳转失效--IE6、7的奇葩bug
一般运用a标签包含img去实现点击图片跳转的功能,这是前端经常要用到的东西. 今天遇到个神奇的bug:如果在img上再包裹一层div,而且div设置了width和height,则图片区域点击时,无任何 ...
- IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法
直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...
- 百度MIP页规范详解 —— canonical标签
百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...
- 【CSS进阶】伪元素的妙用--单标签之美
最近在研读 <CSS SECRET>(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值 ...
- TODO:Laravel 使用blade标签布局页面
TODO:Laravel 使用blade标签布局页面 本文主要介绍Laravel的标签使用,统一布局页面.主要用到到标签有@yield,@ stack,@extends,@section,@stop, ...
- 最新 去掉 Chrome 新标签页的8个缩略图
chrome的新标签页的8个缩略图实在让人不爽,网上找了一些去掉这个略缩图的方法,其中很多已经失效.不过其中一个插件虽然按照原来的方法已经不能用了,但是稍微变通一下仍然是可以用的(本方法于2017.1 ...
- css-父标签中的子标签默认位置
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- xpath提取多个标签下的text
title: xpath提取多个标签下的text author: 青南 date: 2015-01-17 16:01:07 categories: [Python] tags: [xpath,Pyth ...
- 多个Img标签之间的间隙处理方法
1.多个标签写在一行 <img src="/i/eg_tulip.jpg" alt="郁金香" height="100px"/> ...
- html5标签canvas函数drawImage使用方法
html5中标签canvas,函数drawImage(): 使用drawImage()方法绘制图像.绘图环境提供了该方法的三个不同版本.参数传递三种形式: drawImage(image,x,y):在 ...
随机推荐
- 中国 省会 地级市 经纬度 city array
<?php $city_arr = array ( '北京' => array ( 'gis_lng' => '116.405285', 'gis_lat' => '39.90 ...
- Spring集成Quartz定时器
<!-- Spring集成Quartz开始 --> <bean id="startQuertz" lazy-init="false" auto ...
- while和for可以相互转换例子
//while和for循环可以相互转换,以下为简单格式: ;;) A; 等价于 : ) { A; ; } /* Name:while和for可以相互转换例子 Copyright: By.不懂网络 Au ...
- SSE && WebSockets
SSE && WebSockets 参考 http://www.bitscn.com/school/HTMLCSS/201402/194940.html WebSockets 定义了一 ...
- e.currentTarget
e.target总是指向点击的目标 e.currentTarget会指向这个点击标的冒泡对象 <div class="wrap"> wrap <div class ...
- android小知识之EditText输入框之值监控以及类型限制(数字,英语字母,下划线,是否为星号密码)
1.设置EditText的值监听事件 . <span style="font-size:14px;color:#990000;"> EditText ed=new Ed ...
- DDR、DDR2、DDR3产品区别
DDR采用一个周期来回传递一次数据,因此传输在同时间加倍,因此就像工作在两倍的工作频率一样.为了直观,以等效的方式命名,因此命名为DDR 200 266 333 400. DDR2尽管工作频率没有变化 ...
- LBA(逻辑区块地址)及PBA(物理区块地址)
LBA,全称为Logical Block Address,是PC数据存储装置上用来表示数据所在位置的通用机制,我们最常见到使用它的装置就是硬盘.LBA可以指某个数据区块的地址或者某个地址上所指向的数据 ...
- delete了,析构函数却没有调用
析构函数在对象的生命结束时,会自动调用,大家所熟知的智能指针就是根据析构函数的这种特性而实现的,包括Qt的内存管理机制,也都是利用了析构函数的这一机制来实现的.c++创始人Bjarne Stroust ...
- JavaEE Tutorials (13) - 使用锁定控制对实体数据的并发访问
13.1实体锁定和并发概述180 13.1.1使用乐观锁定18113.2锁模式181 13.2.1设置锁模式182 13.2.2使用悲观锁定183