查看: 3249|回复: 0

[DIV/CSS] Html基础学习(基于W3school网络教程)

发表于 2018-1-1 08:00:00

//防止乱码

head中加入

//在head中使用外部样式表进行格式化

//使用html样式表进行格式化

//bgcolor定义背景颜色;background="xxxx"指定背景图片,如图片小于页面,图片会重复显示

//

标签

段落标签。浏览器会忽略源代码中的排版,会省略多余的空格和换行等。

要想换行,可用
来实现。

//h1-h6标题标签

h1标题标签

h2标题标签

h3标题标签

h4标题标签

h5标题标签

h6标题标签

注意:请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。粗体可使用其它标签或 CSS 代替。

//文字居中

用align="center"将文字居中。

//hr标签用于加水平线


//注释

//背景颜色

bgcolor="xxxx"

//背景图像

background="xxxx"

//链接

通过a标签href="xxxx"定义,在新窗口打开用target="_blank"

百度

//图像

通过img的src定义,如果无法显示图片,则显示alt中的文字

xxxx

//文本格式化

文本格式化,这是粗体文本bold,用b标签

文本格式化,这是加重语气strong,用strong标签

文本格式化,这是大号字big,用big标签

文本格式化,这是着重文字emphasized,用em标签

文本格式化,这是斜体文字italic,用i标签

文本格式化,这是小号字small,用small标签

//预格式文本用pre标签

这是

预格式文本。

它保留了 空格

和换行。

//链接到同一页面的某位置,用name属性命名“锚”

查看 Chapter 4。

Chapter 1

This chapter explains ba bla bla

Chapter 2

This chapter explains ba bla bla

Chapter 3

This chapter explains ba bla bla

Chapter 4

This chapter explains ba bla bla

Chapter 5

This chapter explains ba bla bla

//表格用table,border为边框宽度,tr-th-td

表头1 表头2 表头3
100 200 300
400 500 600

结果:

//横跨两列的单元格:

姓名 电话
Bill Gates 55577854 55577855

结果:

//横跨两行的单元格:

姓名 Bill Gates
电话 55577854
55577855

结果:

//带有 单元格边距cellpadding:

First Row
Second Row

结果:

//表格中元素的位置

消费项目 一月 二月
衣服 $241.10 $50.20
化妆品 $30.00 $44.45

//一个无序列表:

  • 咖啡
  • 牛奶

//一个有序列表,start为开始序号:

  1. 咖啡
  2. 牛奶

//Disc 项目符号列表:

  • 苹果
  • 香蕉
  • 柠檬
  • 桔子

//Circle 项目符号列表:

  • 苹果
  • 香蕉
  • 柠檬
  • 桔子

//Square 项目符号列表:

  • 苹果
  • 香蕉
  • 柠檬
  • 桔子

//数字列表:

  1. 苹果
  2. 香蕉
  3. 柠檬
  4. 桔子

//字母列表:

  1. 苹果
  2. 香蕉
  3. 柠檬
  4. 桔子

//小写字母列表:

  1. 苹果
  2. 香蕉
  3. 柠檬
  4. 桔子

//罗马字母列表:

  1. 苹果
  2. 香蕉
  3. 柠檬
  4. 桔子

//小写罗马字母列表:

  1. 苹果
  2. 香蕉
  3. 柠檬
  4. 桔子

//一个嵌套列表:

  • 咖啡
    • 红茶
    • 绿茶

  • 牛奶

//表单:form-input

文本域 text fields

密码域 password,密码在输入时显示*号

复选框 checkbox,是个小方框,checked可指定选项是否默认选定,可以通过点击选择或取消

单选按钮:radio,checked指定默认选项,点击其中一个按钮时,该按钮变为选中状态,其他所有按钮都变为非选中。

下拉列表:select-option,用selected可指定默认选定的选项。

文本域 textarea,rows高,cols宽

按钮 button

提交 submits

fieldset 周边带边框的效果

姓:

名:

密码:

爱好 :篮球足球

性别 :男

请选择出生地:

简介:

健康信息

身高:

体重:

//排列图片:设置对齐方式的图像

图像 在文本中,文字据下,为默认方式

图像 在文本中,文字居中

图像 在文本中,文字局上


带有图像的一个段落。图像的 align 属性设置为 "left"。图像将浮动到文本的最左侧。


带有图像的一个段落。图像的 align 属性设置为 "right"。图像将浮动到文本的最右侧。



回复

使用道具 举报