本帖最后由 小石姐姐 于 2018-5-4 09:43 编辑
HTML的简单使用
1.什么是HTML
HTML:Hyper Text Markup Language --- 超文本标记语言.
* 标记语言：指的是通过一组标签的形式描述事物的一门语言.
* 超文本：比普通的文本更强大.
2.HTML的作用
HTML是用来制作页面(静态页面).(不是从数据库中获得的,是假的数据)(制作各种在浏览器端打开的页面)
3.HTML在那些地方使用
在设计网站的页面的时候都要使用到HTML.
4.HTML的使用
HTML的文件的创建
一个HTML文件,扩展名是.html或者.htm结尾
01.html
5.HTML的结构标签
跟标签:<html></html>
页签标题:<title></title> 加在<head>页签标题</head> 中
<head> -- html的头标签 <head>内容</head>
<body> -- html的体标签 <body>内容</bord>
6.HTML的字体标签
<font>标签:HTML中的字体标签.
使用：<font>文字</font>
* <font>标签的属性:
* <标签 属性名=”属性值” 属性名=”属性值”></标签>
* 属性:
* color属性:字体颜色
* 英文单词设置:black,red,green,blue...
* 使用16进制数设置:#FFFFFF , #FFF
* size属性:字体的大小(1-7)
* face属性:字体(微软雅黑,等各种字体)
完整格式:
<font color="#FF0000" size="7" face="">我是小红2</font><br/>
7.HTML的排版标签
(有可能是一个,也可能是多个) 标签具有自动换行功能,不用写br换行
8.其它标签
标题标签：h标签<h1>...<h6>
段落标签：p标签
字体加粗标签：b标签 <b>训练营/b>
字体斜体标签：i标签 <i>训练</i>
字体下划线：u标签 <u>训练</u>
居中标签：<center>标签 <center>内容</center>
横向分割线: hr 标签 <hr />
9.HTML的图片标签
图片标签:<img>
* 属性:
* src :图片的来源.
* width :图片的宽度.
* height:图片的高度.
* alt :图片找不到显示的内容.
图片的引入的路径问题:
* 路径：相对路径.
* 如果引入的图片和html文件在同一级路径。
* 直接写文件名或者./文件名
<img src="cs10006.jpg" />
<img src="./cs10006.jpg" />
* 如果引入的图片在html文件的上一级路径。
* <img src="../cs10006.jpg" />
* 如果引入的图片在html文件的下一级路径。
* <img src="img/cs10006.jpg" />
*引入上两级的图片
* <img src=”../../cs10006.jpg”/>
引入图片并设置宽和高:
*<img src="logo2.png" height="50" width="200"/>
10.HTML的列表标签
有序列表:
<ol>
<li></li> 中间要显示的内容
</ol>
无序列表:
<ul>
<li></li> 中间要显示的内容
</ul>
无序列表的属性:
* type属性
* disc ：实心点.
* circle ：空心圆
* square ：方块.
有序列表的属性:
* type属性:
* 1 ：数字类型
* a ：英文类型
* i ：罗马字符
* start属性:从哪开始
start 用于设置 数字类型/英文类型/罗马字符 的开始位置例如:从100开始
11.HTML的超链接标签 <a>
* 属性:
* href :链接的路径
* target :打开的方式 (页面默认为在本页打开)
* _self :在自身页面打开(更换自身页面)
* _blank :新打开一个窗口
* 打开本网站网页时:直接写入相对路径就行
* 如果是外部网站,则要写入网站的全路径
在本页打开:
<li><a href="http://www.baidu.com" target="_self">百度</a></li>
在新页打开:
<li><a href="http://www.baidu.com" target="_blank">百度</a></li>
超链接的target属性:
* _self
* _blank
* _parent :在特定时候才使用,其他时候不能用.
|
|
收藏
淘帖
踩
