Day20html

1.web标准

a.结构标准(html):决定网页中的内容
b.表现标准(css):决定网页中内容的布局和样式
c.行为标准(JavaScript):决定网页中的行为和动作(变化)

2.html

a.html:超文本标记语言
标记语言:通过不同的标记来显示不同的内容(以指定的格式)
超文本:除文本以外还可以标记图片、超链接、音频、视频、flash、输入框、按钮等等
html文件就是后缀是.html的文件。

注意:html中大小写不敏感

b.html结构
head中的内容除了title和icon以外其内容都不可见。body代码是网页的内容部分。里面的标签一般都是可见

c.html版本

1.标题标签

        

2.段落标签

        

3.特殊功能标签

html中文本的换行、空格、tab等都是无效的(空白无效)
执行:

字符 十进制 转义字符
" " "
& & &
< < <
> > >
不断开空格(non-breaking space)    

4.字体相关

加粗:b标签/strong标签
b标签只是单纯的文字加粗,strong有强调效果
倾斜:i标签/em标签
i标签只是单纯的文字倾斜,em有强调效果

列表标签分为有序列表、无序列表、自定义列表

1.有序列表

ol标签:整个列表
li标签:代表列表中的元素

        

2.无序列表

        
  • python
  • java
  • c

3.自定义列表

dl标签:代表整个列表
dt标签:分组中的内容

        
abcdef
a
b
c
ghijk
h
i
j

1.图片标签

a.src属性:图片地址,可以是本地图片路径也可以是网络图片的路径
本地图片:可以是绝对路径也可以是相对路径
b.title:设置图片标题(鼠标停留在图片上,显示内容)
c.alt:设置图片加载失败的提示信息

        加载失败
加载失败

2.超链接:a标签

a.内容
b.href:跳转的目标地址
网络地址
本地的html文件
空为刷新
选择器 在当前的页面中跳转到指定的位置

        列表标签

3.target:跳转方法

_self:默认值。在当前页面加载新的网页
_blank:创建一个新的网页

1.表格标签

table标签 整个表格
tr 行
td 单元格

2.边框相关的属性

border:边框的宽度
bordercolor:设置边框颜色(颜色值可以是英语单词,也可也是RGB对应的16进制值)
cellspascing:单元格之间的间隙
cellpadding:单元格内边距

3.背景颜色

bgcolor:背景颜色
可以作为table属性,也可以作为tr属性,也可以作为td的属性

4.宽度和高度

a.作用于table:设置整个表格的宽度和高度(会按比例分配每一行和每一列的宽度和高度)
b.设置单元格的宽度和高度

5.居中

center:居中
a.作用于table,让整个表格在其父标签中居中
b.作用于tr,让整行在单元格居中
c.作用于td,指定单元格居中

a b c
Data Data Data
a b c
aa bb cc
aaa bbb ccc

制作复杂表格

1.制作复杂表格的方法:

a.确定表格的最大行数,在table中用tr表示出来
b.确定每一行有多少个单元格,用td表示出来
c.确定每一个单元格是否有合并现象。如果是行合并就设置rowspan的值,如果是列合并就设置colspan的值

作业:

![## 1.web标准

a.结构标准(html):决定网页中的内容
b.表现标准(css):决定网页中内容的布局和样式
c.行为标准(JavaScript):决定网页中的行为和动作(变化)

2.html

a.html:超文本标记语言
标记语言:通过不同的标记来显示不同的内容(以指定的格式)
超文本:除文本以外还可以标记图片、超链接、音频、视频、flash、输入框、按钮等等
html文件就是后缀是.html的文件。

注意:html中大小写不敏感

b.html结构
head中的内容除了title和icon以外其内容都不可见。body代码是网页的内容部分。里面的标签一般都是可见

c.html版本

1.标题标签

        

2.段落标签

        

3.特殊功能标签

html中文本的换行、空格、tab等都是无效的(空白无效)
执行:

字符 十进制 转义字符
" " "
& & &
< < <
> > >
不断开空格(non-breaking space)    

4.字体相关

加粗:b标签/strong标签
b标签只是单纯的文字加粗,strong有强调效果
倾斜:i标签/em标签
i标签只是单纯的文字倾斜,em有强调效果

列表标签分为有序列表、无序列表、自定义列表

1.有序列表

ol标签:整个列表
li标签:代表列表中的元素

        

2.无序列表

        
  • python
  • java
  • c

3.自定义列表

dl标签:代表整个列表
dt标签:分组中的内容

        
abcdef
a
b
c
ghijk
h
i
j

1.图片标签

a.src属性:图片地址,可以是本地图片路径也可以是网络图片的路径
本地图片:可以是绝对路径也可以是相对路径
b.title:设置图片标题(鼠标停留在图片上,显示内容)
c.alt:设置图片加载失败的提示信息

        加载失败
加载失败

2.超链接:a标签

a.内容
b.href:跳转的目标地址
网络地址
本地的html文件
空为刷新
选择器 在当前的页面中跳转到指定的位置

        列表标签

3.target:跳转方法

_self:默认值。在当前页面加载新的网页
_blank:创建一个新的网页

1.表格标签

table标签 整个表格
tr 行
td 单元格

2.边框相关的属性

border:边框的宽度
bordercolor:设置边框颜色(颜色值可以是英语单词,也可也是RGB对应的16进制值)
cellspascing:单元格之间的间隙
cellpadding:单元格内边距

3.背景颜色

bgcolor:背景颜色
可以作为table属性,也可以作为tr属性,也可以作为td的属性

4.宽度和高度

a.作用于table:设置整个表格的宽度和高度(会按比例分配每一行和每一列的宽度和高度)
b.设置单元格的宽度和高度

5.居中

center:居中
a.作用于table,让整个表格在其父标签中居中
b.作用于tr,让整行在单元格居中
c.作用于td,指定单元格居中

a b c
Data Data Data
a b c
aa bb cc
aaa bbb ccc

制作复杂表格

1.制作复杂表格的方法:

a.确定表格的最大行数,在table中用tr表示出来
b.确定每一行有多少个单元格,用td表示出来
c.确定每一个单元格是否有合并现象。如果是行合并就设置rowspan的值,如果是列合并就设置colspan的值
代码:



    
        
        
    
    
        

个人简历

学院 深圳大学计算机与软件学院
专业 计算机及应用
姓名 马化腾 性别 名族 汉族
出生年月 1971年10月29日 籍贯 中国 身高 180
学历 本科 政治面貌 不详
就业意向 腾讯CEO
兴趣爱好 坑玩家的钱
个人说明 腾讯公司主要创办人之一。现任腾讯公司控股董事会主席兼首席执行官;全国青联副主席。
家庭住址 广东省汕头市潮南区
住宿地址 不详 联系电话 400652555 手机 12345678910
本人简历 时间 学校 任职
2015年7月 中国 当选为十二届全国青联副主席。
2018年1月 中国 当选第十三届全国人民代表大会代表(广东省)。
2018年5月9日 中国 当选中国网络社会组织联合会副会长。
2014年时代周刊人物
2015年中国内地最佳CEO
捐139亿成首善
2017中国最具影响力的50位商界领袖
《福布斯》世界最伟大领袖榜单
榜单显示,马化腾身家453亿美元,位列17位,成为中国和亚洲首富。

结果:

image

你可能感兴趣的:(Day20html)