小白的HTML笔记

元素

<p>段落

<a href="default.htm">链接

<br/>换行

属性

例如上面的链接地址就在href中指定

<h1>定义标题开始

<h1 align="center">拥有关于对齐方式的附加信息

<body>定义HTML文档的主题

<body bgcolor="yellow">拥有关于背景颜色的附加信息

<table>定义HTML表格

<table border="1">拥有关于表格边框的附加信息

属性、属性值和元素对大小写不敏感,推荐使用小写

标题

<h1>是最大的标题<h6>是最小的标题

搜索引擎使用标题为网页结构和内容编制索引,因此用标题来呈现文档结构是很重要的

水平线<hr>标签在HTML页面中创建水平线

注释 <!--内容-->

查看源代码  只需要右键,查看源代码

HTML 输出 - 有用的提示

我们无法确定 HTML 被显示的确切效果。屏幕的大小,以及对窗口的调整都可能导致不同的结果。

对于 HTML,您无法通过在 HTML 代码中添加额外的空格或换行来改变输出的效果。

当显示页面时,浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。需要注意的是,HTML 代码中的所有连续的空行(换行)也被显示为一个空格。

文本格式化专题

1)<b>  bold粗体的意思

2)<strong>加粗,用法和bold用法相似

3)<em>强调,斜体

4)<i>italic斜体

5)<big>大一号

6)<pre>预格式文本,可以保留空格和换行

用于显示计算机/编程代码的标签

<code>computer code

<kbd>keyboard input

<tt>teletype text

<sample>Sample text

<var>computer variable

<addresss>在HTML文件中写地址

在某些浏览器中,当您把鼠标移至缩略词语上时,title 可用于展示表达的完整版本

 <abbr title="etcetera">etc.<abbr/>该代码可以用于表达title的完整版本

上面的用法和效果与<acronym>和abbr相同

改变文字方向

<bdo dir="rtl">

内容

<bdo/>

其中“trl”的作用应该是使文字从右向左输出

引用

长引用<blockquote>浏览器会 插入换行和外边距,而<q>(短引用)元素不会有任何特殊的呈现

删除和下划线

删除<del>内容<del/>,下划线<ins>

文本格式化标签

标签 描述

<b> 定义粗体文本。

<big> 定义大号字。

<em> 定义着重文字。

<i> 定义斜体字。

<small> 定义小号字。

<strong> 定义加重语气。

<sub> 定义下标字。

<sup> 定义上标字。

<ins> 定义插入字。

<del> 定义删除字。

<s> 不赞成使用。使用 <del> 代替。

<strike> 不赞成使用。使用 <del> 代替。

<u> 不赞成使用。使用样式(style)代替。

“计算机输出”标签

标签 描述

<code> 定义计算机代码。

<kbd> 定义键盘码。

<samp> 定义计算机代码样本。

<tt> 定义打字机代码。

<var> 定义变量。

<pre> 定义预格式文本。

<listing> 不赞成使用。使用 <pre> 代替。

<plaintext> 不赞成使用。使用 <pre> 代替。

<xmp> 不赞成使用。使用 <pre> 代替。

引用、引用和术语定义

标签 描述

<abbr> 定义缩写。

<acronym> 定义首字母缩写。

<address> 定义地址。

<bdo> 定义文字方向。

<blockquote> 定义长的引用。

<q> 定义短的引用语。

<cite> 定义引用、引证。

<dfn> 定义一个定义项目。

HTML编辑器

专业的HTML编辑器

  • Adobe Dreamweaver
  • Microsoft Expression Web
  • CoffeeCup HTML Editor

也可以选择使用PC自带的记事本工具

编写完毕之后将文件拓展名改成.html或者.htm

HTML样式

1.通过添加到<head>部分的样式信息对HTML进行格式化

连接到外部样式表

没有下划线的链接

HTML链接

1.创建超链接

站内链接

<a href="/index.html">内容</a>

站外链接

<a href="http://www.baidu.com/">

2.创建超链接

<a href:“www.baidu.com”><img border="0" src="这里输入图片的引用地址">

</a>\

3.HTML链接-target属性

<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

使用target属性,可以定义被连接的文档在何处显示,而例子中的target="_blank"会在新窗口打开文档

4. name属性

因此name属性的作用是设置标签,至于标签的使用就要用到#

___________________________________________________________________________________________________________________________________

___________________________________________________________________________________________________________________________________

插入图像

1.举例

<p>

<img src="图片地址" width="128" height="128"/>

</p>

2.定义图像的语法是

<img src:"url"/>  注:URL(uniform resource locator),统一资源定位器,是www页的地址

浏览器将图像显示在文档中图像标签出现的地方。如果你将图像标签置于两个段落之间,那么浏览器会首先显示第一个段落,然后显示图片,最后显示第二段。

替换文本属性(图片的替代品)

alt属性用来为图像定义一串预备的可替换的文本。替换文本的值,是用户定义的

例如

<img src:“boat.gif” alt="Big Boat">

在浏览器无法载入图像时,替换文本属性告诉读者她们失去的信息。此时,浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯,这样有助于更好的显示信息,并且对于那些使用纯文本浏览器的人来说是非常有用的。

如何向HTML页面添加背景图片

<body background="url">

排列图片

 

 

 

创建图片映像

关于这个例子我有一些不懂的地方: usemap=#planetmap        map标签的作用及用法     area标签内的各个参数用法

现在对这些问题进行解答。

map标签用法传送门:http://www.w3school.com.cn/tags/tag_map.asp

area标签用法传送门:http://www.w3school.com.cn/tags/tag_area.asp

map标签简要介绍map标签中必要的属性有id(为map定义唯一的名称),可选的属性有name(为image—map规定的名称)

area标签而area标签是用来定义图像映射中的区域(图像映射指的是带有可点击区域的图像),而且area元素总是嵌套在<map>标签中

img标签中的usemap属性与<map>元素name属性相关联,创建图像与映射之间的联系

时间: 2024-08-27 23:37:52

小白的HTML笔记的相关文章

Java小白入门学习笔记demo1输出helloworld

public class Hello{//公共   类     类名  public static void main(String[] args){ //     公共   静态  无返回值 主方法(字符串[] 参数)   System.out.println("helloworld"); //   系统.输出.打印换行(输出内容); // 输出语句,首字母必须大写,println为输出内容后自动换行,print输出内容不换行 }}

静态数码管——小白的单片机笔记

数码管按照接线方式分为:共阴和共阳. 对于实验板的数码管器工作过程如下: 单片机通过接口(在此为P2^2,P2^3,P2^,4)与138译码器通讯,译码器Y0接口使最后一个LED数码管工作. P0口发送数据显示. *************************************** 程序如下: #include"reg52.h"typedef unsigned char u8;typedef unsigned int u16; sbit YMQA=P2^2; sbit YMQ

day04关于MySqL&mdash;Android小白的学习笔记

Mysql入门 1. 数据库基本知识(了解) 1.1.数据库介绍 1.1.1.什么是数据库?数据库的作用是什么? 数据库就是存储数据的仓库,其本质是一个文件系统,数据按照特定的格式将数据存储起来,用户可以对数据库中的数据进行增加,修改,删除及查询操作 想要存储并读取数据: 没有数据库: 1.新建一个文件夹用来存储文件: 2.把对应的数据以字符流的形式放入对应的文件中: 3.把文件以某种规律放入文件夹中: 4. 要查询对应数据时,需要将数据仓库所有文件以字符流形式获取并遍历,以取得对应数据的某些标

无源蜂鸣器——小白的单片机笔记

蜂鸣器分类:有源蜂鸣器,无源蜂鸣器. 这里的"源"不是指电源.而是指震荡源. 也就是说,有源蜂鸣器内部带震荡源,所以只要一通电就会叫. 而无源内部不带震荡源,所以如果用直流信号无法令其鸣叫,必须用2K~5K的方波去驱动它. 有源蜂鸣器往往比无源的贵,就是因为里面多个震荡电路. 无源蜂鸣器的优点是:1.便宜2.声音频率可控,可以做出"多来米发索拉西"的效果.3.在一些特例中,可以和LED复用一个控制口有源蜂鸣器的优点是:程序控制方便 .****************

动态数码管——小白的单片机笔记

138译码器控制LED数码管使能 138译码器的ABC接口接线: A=P2^2;B=P2^3;C=P2^4; 74H245与P0口通讯控制数码管显示内容. ******************************************************************* 教程视频的控制内容: 是数码管自右向左依次显示01234567 程序如下: #include"reg52.h"typedef unsigned char u8;typedef unsigned in

小白的 MySQL 笔记(一)

来自 stackoverflow 的内容居多. 1- MySQL VARCHAR size? 2- 数据库设计范式 3- What is InnoDB and MyISAM in MySQL ? 4- 为什么手写DDL? 5- Data access object (DAO) in Java MySQL VARCHAR size? Q: I'm wondering, if I have a VARCHAR of 200 characters and that I put a string of

Linux grub密码设定

Linux grub密码设定 grub密码分为明文和密文 1.明文设定只需要在vim /etc/grub.conf文件中编辑一下就可以了,具体如图: 2.密文设定分为好几种加密方式:现在使用的是grub-md5-crypt来进行密文加密,如下图: 把生面生成的密文复制到/etc/grub.conf文件中,然后保存退出就可以了,如下图: 还有另一种加密算法:grub-crypt --sha-256加密方式. 在命令行输入grub-crypt --sha-256命令,然后输入密码,就会产生一长串字符

asp.net MVC 小白的笔记-说下这几天学习mvc的经历

到现在才来学习mvc,算是有点晚了,接触的比较晚! 首先是接触到了基础的EF,先说下EF,EF是一种ORM(实体映射对象)框架,是基于ado.net的一种开发更便捷的对数据库进行的技术,有2种开发,一种是ModelFirst,就是 先通过新建ado模型,把数据库中的表直接映射到项目中的模型视图 , 该模型视图下有数据库中的各种字段,并且这些字段会自动生成一个类,映射成一个实体类.还有另外一种就是CodeFirst,顾名思义 就是先写代码,建视图,根据所建的视图,视图之间的关系,关系这里有一个非常

linux小白学习笔记(一)常用基础命令

ls                                    查看文件 (相当于dos下的dir)(其后可加路径,加 -a,可以查看隐藏文件) cd                                  改变当前路径(与dos下相同,cd +所在目录内文件夹名(相对路径),cd+/新路径(绝对路径),cd+..进入上个目录,cd进入根目录) clear                              清屏ls (相当于dos下的cle) 命令 “+ ”——he