9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)

2023-07-29,,

网页基础知识

一、HTML语言

HTML语言翻译汉语为超文本标记语言。

二、网页的分类

1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码。静态网页的后缀有.html .htm。

2.动态页面:动态页面可以从后台更改改,数据来源于数据库,后台更改后网页原代码不会发生变化。动态网页的后缀有 .php(php做的) .aspx(.net语言做的) .jsp(java做的)。

三、网页制作软件Dreamweaver

Dreamweaver简称DW,工作区分为三部分,分别为代码、拆分、设计,在制作网页时,推荐使用代码界面。

DW中还会用到的页面类型有CSS(样式设计,网页编码完成后对网页进行美化)、JavaScript(用来给HTML网页增加动态功能)、PHP(超文本预处理器,制作动态网页效果效果较好)

四、网页的基础语法

1.单元     网页的最小单元为标签,常见标签有双标签元素和单标签元素。

2.双标签元素    双标签元素是由两个标签构成的,构成形式为<标签名 属性>内容</标签名>,主要作用是作为网页内容的容器。

3.单标签元素    单标签元素是由一个标签构成的,构成形式为<标签名 属性>或者<标签名 属性/>,单元素标签的作用与双标签元素不同,一般起控制性作用。

4.语法注释    语法注释在网页代码中起注释作用,其标签只在网页原代码中显示,在网页中不会显示,只能为网页编程人员所见。注释语法形式为<!-- 需要注释的文字 -->。

五、网页基础标签

1. <html> 内容 </html>代表网页

2.<head>  </head>代表头标签,里面主要放控制性的东西。

3.<body>  </body>代表主题标签,里面主要放网页内容。

4.<meta>代表编码格式,我们在学习DW时选择的编码为utf-8,utf-8是众多格式里面的一种,也是国际通用的编码格式。我国通用的编码为GB2312。

5.<title></title>代表网页标题,是在打开网页时显示的网页名称。

通用标签、属性

一、body属性

1.bgcolor属性:网页背景颜色

2.text属性:规定文档中所有文本的颜色。

3.background属性:规定文档的背景图像。

二、路径

1.绝对路径: 从根开始的,越来越具体,逐渐具体到目标文件。“/” 表示在某一个文件夹里面。

2.相对路径: 从自身开始的,同属于一个目录下的。“./”表示当前目录;“../”代表上级目录;“/”代表根

注意:所有的文件路径都是正斜杠(/),Windos系统里面的都是反斜杠(

三、格式控制

1.<font>  规定文本的字体、字体尺寸、字体颜色。

  ①color:字体颜色;②face:字体样式;③size字体大小,字体选择时,+1就是原字体的1倍,+2就是原字体的2倍,依次类推。

2.格式控制:<b>:加粗

<i>:倾斜

<u>:下划线

<strong>:加粗    强调,语气加强用。

<em>:倾斜  强调,语气加强用。

<br>:换行

&nbsp:空格

<h1>--<h6>:做标题的,<h1>—<h6>标题递减。

<p>:做段落

<span>:层标签    一般用来存放文字,文字内容多大就占用多大的地方

<div>:层标签     什么文件都可以存放,默认占用一行。

需要注意的几点:1.网站字体一般选择微软雅黑,如果选择别的字体,其他电脑用户电脑里没有这种字体的话就显示不出来这种字体。

2.写代码时写完开始立马写结束,最后再写内容。

3.代码换行时,不能不加换行,也不能每行标签都加换行,最好是每一个功能块之间加换行。

4.在编写代码时,所有代码包括符号都必须是在输入法在英文状态下编写的。

通用标签(有序列表、无序列表、常用标签)

<ol><li>:有序序列

<ol type="1">
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ol>

网页上显示为

    第一项
    第二项
    第三项

    <ol type="I">
    <li>第一项</li>
    <li>第二项</li>
    <li>第三项</li>
    </ol>

上面代码在网页上显示为

I.第一项

II.第二项

III.第三项

<ul><li> :无序列表

<ul type="square">
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ul>

网页上显示为

■ 第一项

■  第二项

■ 第三项

square=■     circle=○    disc=●

常用标签

一、<a></a>

1.超链接    <a href="http://www.baidu.com">百度</a>

2.超链接的条件   ① 超链接的内容

②指向明确   在href属性里面写上指向的地方

3.功能

①做超链接

②做下载   下载的内容为href指向的文件。不能作为下载的内容的文件有文本文档、图片文件、网页文件,不能下载的原因是此三种文件都可以在网页上打开。

③做锚点    先做一个锚点,锚点代码为<a name="top"></a>。再在其它地方做一个回到锚点的代码,代码为<a href="#top"></a>回到顶部,注意top前面的#健。

二.<img/>单标签元素

1.src    图片的路径   <a href="9c7b9c15d195f155b8127b26.jpg">图片显示名称</a>

2.width   图片的宽度  <img src="91a0ce0020c142541c958332.jpg" width="72" height="96" alt="网页图标" title="测试图片" />

3.height  图片的高度

4.alt    提示文字    当图片由于某些原因显示不出来时,图片位置显示的字体

5.title  图片的标题   鼠标放上几秒后显示

6.图片超链接   点击图片会连接到一个网址     网站超链接里面的文字嵌套成图片

<a href="http://www.baidu.com">
  <img src="91a0ce0020c142541c958332.jpg" />
</a>

9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)的相关教程结束。

《9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补).doc》

下载本文的Word格式文档,以方便收藏与打印。