Html 语法学习笔记二
1、图像标签(<img>)和源属性(Src)
在 HTML 中。图像由 <img> 标签定义。
<img> 是空标签,意思是说,它仅仅包括属性,而且没有闭合标签。
要在页面上显示图像,你须要使用源属性(src)。src 指 "source"。源属性的值是图像的 URL 地址。
定义图像的语法是:
<img src="url" />
URL 指存储图像的位置。
假设名为 "boat.gif" 的图像位于 www.w3school.com.cn 的 images 文件夹中,那么其 URL 为 http://www.w3school.com.cn/images/boat.gif。
浏览器将图像显示在文档中图像标签出现的地方。假设你将图像标签置于两个段落之间。那么浏览器会首先显示第一个段落,然后显示图片,最后显示第二段。
替换文本属性(Alt)
alt 属性用来为图像定义一串预备的可替换的文本。
替换文本属性的值是用户定义的。
<img src="boat.gif"alt="BigBoat">
在浏览器无法载入图像时,替换文本属性告诉读者她们失去的信息。此时,浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯。这样有助于更好的显示信息,而且对于那些使用纯文本浏览器的人来说是非常实用的。
主要的注意事项 - 实用的提示:
假如某个 HTML 文件包括十个图像,那么为了正确显示这个页面,须要载入 11 个文件。载入图片是须要时间的。所以我们的建议是:慎用图片。
小注:
../表示源文件所在文件夹的上一级文件夹,../../表示源文件所在文件夹的上上级文件夹,以此类推。
2、<table> 标签
<table> 标签定义 HTML 表格。
简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。
tr 元素定义表格行,th 元素定义表头,td 元素定义表格单元。
更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。
小注:
<table>标签下的边框属性:
小注:
bordercolordark td 的左上边框的颜色
bordercolorlight td 的右下边框的颜色
仅ie系列支持
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />
表格合并部分Demo:点击打开链接
3、<tr> 标签
<tr> 标签定义 HTML 表格中的行。
tr 元素包括一个或多个 th 或 td 元素。
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />
4、<td> 标签
<td> 标签定义 HTML 表格中的标准单元格。
HTML 表格有两类单元格:
表头单元 - 包括头部信息(由 th 元素创建)
标准单元 - 包括数据(由 td 元素创建)
td 元素中的文本一般显示为正常字体且左对齐。
提示:假设须要将内容横跨多个行或列,请使用 colspan 和 rowspan 属性。
可选的属性
5、<th> 标签
定义表格内的表头单元格。
HTML 表单中有两种类型的单元格:
- 表头单元格 - 包括表头信息(由 th 元素创建)
- 标准单元格 - 包括数据(由 td 元素创建)
th 元素内部的文本一般会呈现为居中的粗体文本。而 td 元素内的文本一般是左对齐的普通文本。
提示:假设须要将内容横跨多个行或列,请使用 colspan 和 rowspan 属性。
小注:
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />
6、<colgroup> 标签
<colgroup> 标签用于对表格中的列进行组合。以便对其进行格式化。
如需对所有列应用样式。<colgroup> 标签非常实用,这样就不须要对各个单元和各行反复应用样式了。
<colgroup> 标签仅仅能在 table 元素中使用。
Html 语法学习笔记二的更多相关文章
- Redis学习笔记二 (BitMap算法分析与BitCount语法)
Redis学习笔记二 一.BitMap是什么 就是通过一个bit位来表示某个元素对应的值或者状态,其中的key就是对应元素本身.我们知道8个bit可以组成一个Byte,所以bitmap本身会极大的节省 ...
- AJax 学习笔记二(onreadystatechange的作用)
AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...
- [Firefly引擎][学习笔记二][已完结]卡牌游戏开发模型的设计
源地址:http://bbs.9miao.com/thread-44603-1-1.html 在此补充一下Socket的验证机制:socket登陆验证.会采用session会话超时的机制做心跳接口验证 ...
- java之jvm学习笔记二(类装载器的体系结构)
java的class只在需要的时候才内转载入内存,并由java虚拟机的执行引擎来执行,而执行引擎从总的来说主要的执行方式分为四种, 第一种,一次性解释代码,也就是当字节码转载到内存后,每次需要都会重新 ...
- 《SQL必知必会》学习笔记二)
<SQL必知必会>学习笔记(二) 咱们接着上一篇的内容继续.这一篇主要回顾子查询,联合查询,复制表这三类内容. 上一部分基本上都是简单的Select查询,即从单个数据库表中检索数据的单条语 ...
- Django学习笔记二
Django学习笔记二 模型类,字段,选项,查询,关联,聚合函数,管理器, 一 字段属性和选项 1.1 模型类属性命名限制 1)不能是python的保留关键字. 2)不允许使用连续的下划线,这是由dj ...
- 毕业设计 之 五 PHP语法学习笔记
毕业设计 之 四 PHP语法学习笔记 作者:20135216 平台:windows10 软件:XAMPP,DreamWeaver 说明:该笔记是对网站编程语言的详细学习 一.PHP基础 0. 关于环境 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
- python3.4学习笔记(二十一) python实现指定字符串补全空格、前面填充0的方法
python3.4学习笔记(二十一) python实现指定字符串补全空格.前面填充0的方法 Python zfill()方法返回指定长度的字符串,原字符串右对齐,前面填充0.zfill()方法语法:s ...
随机推荐
- 编译SASS
编译SASS sass编译有很多种方式,如命令行编译模式.sublime插件SASS-Build.编译软件koala.前端自动化软件codekit.Grunt打造前端自动化工作流grunt-sass. ...
- windows7 64位下运行 regsvr32 注册ocx或者dll的方法
来源:转载 it won't work for you unless you have some form of Visual Basic tools loaded on your system: ...
- 从零开始PHP学习 - 第一天
写这个系列文章主要是为了督促自己 每天定时 定量消化一些知识! 同时也为了让需要的人 学到点啥~! 本人技术实在不高!本文中可能会有错误!希望大家发现后能提醒一下我和大家! 偷偷说下 本教程最后的目 ...
- 不同的strcmp
Android libc中的strcmp https://android.googlesource.com/platform/bootable/bootloader/legacy/+/donut-re ...
- poj 3323 Matrix Power Series (矩阵乘法 非递归形式)
为了搞自动机+矩阵的题目,特来学习矩阵快速幂..........非递归形式的求Sum(A+A^2+...+A^k)不是很懂,继续弄懂................不过代码简洁明了很多,亮神很给力 # ...
- CentOS 七 vs CentOS 6的不同
CentOS 七 vs CentOS 6的不同 CentOS 7 vs CentOS 6的不同(1)桌面系统[CentOS6] GNOME 2.x[CentOS7] GNOME 3.x(GNOME ...
- Oracle - index (索引)
索引: 一种独立于表的模式对象, 可以存储在与表不同的磁盘或表空间中 @ 索引被删除或损坏, 不会对表产生影响, 其影响的只是查询的速度 @ 索引一旦建立, Oracle 管理系统会对其进行自 ...
- struts2 全局格式化,格式化时间,金钱,数字
//在前台页面去控制时间,数字,小数,金钱,是极其不明智的选择,除非你是写了良好的 js api 像freemarker , struts 都有良好的标签,我们应该好好利用,才发现的,给大家分享一下 ...
- web - float , 浮动
浮动 : 使元素脱离文档流,按照指定的方向发生移动,遇到父级边界或者相邻的浮动元素则停下来: 元素被设置浮动属性后,呈现的特征有: 1.多个块可以在一行显示 2.内联元素支持狂傲 3.默认宽度由内容撑 ...
- 消息处理之performSelector
performSelector和直接调用方法的区别 performSelector: withObject:是在iOS中的一种方法调用方式.他可以向一个对象传递任何消息,而不需要在编译的时候声明这些方 ...