昨天介绍了linux的常用命令,今天介绍html标签的使用。
包含经常使用的div,span,p,ul,li,H1-H6,表格等等标签的使用。
课堂笔记
知识点:
一、网站如何工作
二、xhtml介绍和基础
三、xhtml实体
四、无序和有序列表
五、图像
六、表格应用
七、超连接
八、练习:公司成本报表
一、网站如何工作
c/s:
b/s:
网站:没有业务流程。
酒店管理系统:
oa
工作:
二、xhtml介绍和基础
1、html hyperText markup language(超文本标记语言)
2、xhtml extensible hyperText markup language(扩展的超文本标记语言)
xhtml :标记语言:
3、标记分类:
单标记:
双标记:文本内容
4、标记属性:
属性:事物的特性。
我的理解:事物能用“有”来形容的
注意;
1> 无序
2> 每个属性都不是必须的。
3> 属性名称="属性值"
5 xhtml文档结构:
xhtml:静态页面:.html .htm shtml
6 文本修饰:加粗 斜体....
加粗
斜体
下划线
删除线
上标
换行
段落 (换行加一空行)
划线
color="#00ff00"颜色
width="400" 长度
size="100" 粗细
align="right 水平位置的左中右
color="#00FF00"
size="+6" 大小
face="华文彩云" 字体
注意: 标记可以嵌套,标记遵循就近原则。
三、xhtml实体
特殊符号用实体来替代:
>>
<
& &
'单引号
"双引号
空格
© 版权符号
®注册符号
£
n范围1-6 文章标题标记 一次减小
四、无序和有序列表
无序列表:
有序列表
五、图像
路径规则:
绝对路径:c:/windows/system32/a.html
相对路径:********
平级:直接写文件名
下一级:文件夹名称/文件名 images/aa/1.jpg
上一级 :..
src="路径"
width="80"
height="200"
border="5" 边框
七、超连接
跳转到外网:baidu
本地跳转:studyWork
下载:images
补充:图片超链接
六、表格应用*******
table属性
主要属性
border="1" 边框
align="center|left|right" 水平位置
width="600" 宽
height="250"高
cellpadding="0" 文字到边框的距离
cellspacing="0" 边框的厚度
辅助属性
bordercolor="#00FF00" 边框色
bgcolor="#CC0000" 背景色
background="images/2.jpg" 背景图
注意:背景图和背景色同时存在,背景图起作用。
行
align="center" 该行的文字的水平位置
bgcolor="#00FF00"
height="40"
valign="bottom" 垂直位置
align
valign
width
height
colspan=""合并列
rowspan="" 合并行
八、练习:公司成本报表
实现的页面效果如下
实现效果
最后实战就是用table完成下面表格制作
领取专属 10元无门槛券
私享最新 技术干货