HTML+CSS学习(一)

一.html的规范

(1).一个html文件包括三个重要部分:

  1. html的开始和结束标签,即最外层标签<html></html>
  2. 文件的头部<head>设置相关文件信息</head>
  3. 文件的主体<body>写要在页面上显示的内容</body>  

(2).html基本结构:

<html>                                      html的开始标签,即最外层标签

<head></head>                       文件的头部 

<body></body>                       文件的主体

</html>                                     结束标签

(3).内容基本语法如下:<元素名称>要控制的元素</元素名称>

在每个HTML标记中,还可以设置一些属性,控制HTML标记所建立的元素,这些标记将位于所建元素的首标记,

     语法如下:<元素名称  属性1="",属性2=""......></元素名称>

二.html基础的几个标签

标签的写法分为:自闭和双<>

1.标题标签(双<>)

<h1><h1>————————————<h6></h6>

功能:标题字体大小(一共有六级标题,第一级字体最大)、加粗、自动换行

2.格式化标签(双<>)

加粗标签:<b></b>

下划线标签:<u></u>

斜体标签:<i></i>

3.上标、下标标签(双<>)

上标:<sub></sub>

下标:<sup></sup>

4.预先格式化标签(双<>):<pre></pre>

5.换行标签(自闭):<br/>

6.文字标签:<span></span>

7.段落标签:<p></p>

6.列表标签(双<>)

有序(ol代表行;li代表列)如:

<ol>

       <li>第一项</li>

       <li>第二项</li>

        、、、

<ol>

无序(ul代表行;li代表列)如:

<ul>

      <li>第一项</li>

       <li>第二项</li>

      、、、

</ul>

7.表格标签 (table代表一个表格、td代表列,tr代表行) 如:

<table>

<tr>                     

<td>第一格</td>            

、、、、

</tr>

</table>

8.图片(自闭)

<img  src="图片路径"  alt="1.图像没被加载显示的文字2.浏览网页,图片加载完成,鼠标放在图片上的显示文字">

src路径分为三种:相对路径、绝对路径、远程路径

相对路径:1.链接到同一级目录下,则只需要输入要链接文档的名称 如:<img  src="1.1.html">

                  2.链接到下一级目录下,则先输入目录名,然后加"/",再输入文件名 如:<img  src="ha/1.1.html">

                  3.链接到上一级,则先输入../,然后输入目录名,再输文件名 .(一个"."代表本级,两个就表示链接到上一级,以此类推)如:<../bia/ha/1.1.html>

绝对路径:文件或目录在硬盘上的真正路径 如:<img  src="G:\10.14前端\1014\1.1.html">

远程路经:http://+"网址". 如:<img src="https://www.baidu.com/img/bd_logo1.png?qua=high">

9.块标签(相当于一个容器,用来做网站的布局)<div></div>

三.超链接的使用

语法:<a  herf="链接地址" >链接元素</a>

注:链接地址可以是绝对路径,也可以是相对路径

做锚标记

1.建立书签        <a name="书签名称">文字</a>

2.为书签制作链接:链接同一页面        <a herf="#书签名称">链接文字</a>

                                链接不同页面        <a herf="链接文件的地址#书签名称">链接文字</a> 

四.iframe框架

可以将一个html文档嵌入一个html显示中

语法:<iframe  src="文件"  name="框架名称"></iframe>

 

 

 

 

 

 

 

 

 

 

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值