• HTML的基本语法


    HTML的文件结构:<html>

                      <head>网页头部信息</head>

                      <body>网页主体正文部分</body>

                      </html>

    HTML的基本标记:定义网页背景色——bgcolor

                       <body bgcolor=”背景颜色 ”>

                      设置背景图片——backgroung

                       <body background=”图片的地址 ”>

                      设置文字颜色——text

                       <body text=”文字的颜色 ”>

                      设置链接文字属性

                       <body link=”颜色 ”>

                      (使用alink可以设置鼠标单击超链接时的颜色

                        使用vlink可以设置已访问过的超链接颜色)

                       设置页面边距——margin

                       topmargin     设置顶边的距离

                       leftmargin     设置左边的距离

                       rightmargin    设置右边的距离

                       bottommargin  设置底边的距离

                       页面的头部元素<!DOCTYPE>和<head>

                        <!DOCTYPE>为浏览器提供的一项声明

                        <head>文档头部信息</head>

                       页面标题元素<title>

                        <title>…</title>(输入标题信息在浏览器上显示)

                       元信息元素<meta>

                           设置页面关键词

                            <meat name=”keywords ”content=”输入具体的关键词”>

                           设置页面主要内容

                            <meat name=”description ”content=”页面描述 ”>

                           定义页面的搜索方式

                            <meat name=”robots ”conten=”搜索方式 ”>

                       搜索方式取值:all 表示能搜索当前网页及其链接的网页

                                     nofollow 搜索引擎不继续通过此网页的链接搜索其他的网页

                                     follow 搜索引擎继续通过此网页的链接搜索其他的网页

                                     index 表示能搜索当前网页

                                     noindex 表示不能搜索当前网页

                                     none 搜索引擎将忽略此网页

                            定义编辑工具(generator:设置编辑工具)

                             <meat name=”generator ”content=”编辑软件的名称 ”>

                            定义页面的作者信息(author:设置作者信息)

                             <meat name=”author ”content=”作者的姓名”>

                            定义网页文字及语言(http-equiv 用于传送HTTP通信协议的标头)

                             <meat http-equiv=”content-type”content=”text/html ;charest=字符集类型”/>

                            定义页面的跳转 (refresh网页刷新)

                             <meat http-equiv=”refresh ”content=”跳转的时间;URL=跳转到的地址”>

                            定义页面的版权信息——copyright

                             <meat name=”copyright ”content=”©http://www.baidu.com”/>

    脚本元素<script>

    <script type=”text/javascript ”src=”dru.js ”></script>

           创建样式元素<style>

    <style type=”text/css ”>

    …………………………………………

    </style>

    链接元素<link>

    <head>

    <link rel=”stylesheet ”type=”text/css “href=”theme.css “/>

    </head>

    设置文字与段落格式

    插入空格符号:&nbsp

    输入特殊符号:&-&amp;﹤-&lt;﹥-&gt;x-&times;§-&sect;©-&copy;®-&reg;™-&trade

    设置字体——face

            <font face=”字体样式 ”>……</font>

           设置字号——size

            <font size=”文字字号 ”>……</font>

           设置文字颜色——color

            <font color=”字体颜色 ”>……</font>

           设置粗体、斜体、下划线——b、strong、em、u

    <b>加粗的文字</b>

    <strong>加粗的文字</strong>

    <i>斜体文字</i>

    <em>斜体文字</em>

    <cite>斜体文字</cite>

    <u>下划线的内容</u>

    设置上标和下标——sup、sub

    <sup>上标内容</sup>

    <sub>下标内容</sub>

    设置段落的格式

           段落标记——p

             <p>段落文字</p>

    段落的对齐属性——align

    <aling=对齐方式>(left 左对齐、right 右对齐、center 居中对齐)

    不换行标记——nobr

    <nobr>不换行文字</nobr>

    换行标记——br

    <br>

    插入水平线——hr

    <hr>

    设置水平线宽度与高度属性——width、size

    <hr width=”宽度 ”>

    <hr size=”高度 ”>

    设置水平线的颜色——color

    <hr color=”颜色 ”>

    设置水平线的对齐方式——aling

    <hr aling=”对齐方式 ”> (left 左对齐、right 右对齐、center 居中对齐)

    水平线去掉阴影——noshade

    <hr noshade>

    设置滚动文字

    滚动文字标签——marguee

    <marquee>滚动的文字</marquee>

    滚动方向属性——direction (默认:文字滚动的方向是从右向左的,可通过direction标记来设置滚动的方向)

    <marquee direction=”滚动方向 ”>滚动的文字</marquee>

    滚动方式属性——behavior

    <marquee behavior=”滚动方式 ”>滚动的文字</marquee>

    Behavior标记的属性:scroll-循环滚动,默认效果

                        Slide-只滚动一次就停止

                        alternate-来回交替进行滚动

    滚动速度属性——scrollamount

    <marquee scrollamount=”滚动速度 ”>滚动的文字</marquee>

    滚动延迟属性——scrolldelay (毫秒)

    <marquee scrolldelay=”时间间隔 ”>滚动的文字</marquee>

    滚动循环属性——loop

    <marquee loop=”循环次数 ”>滚动的文字</marquee>

    滚动范围属性——width、height

    < marquee width=”背景宽度 ”height=”背景高度 ” >滚动的文字</marquee>

    滚动背景颜色属性——bgcolor

    <marquee bgcolor=”背景颜色 ”>滚动的文字</marquee>

    滚动空间属性——hspace、vspace(设置滚动文字周围的文字与滚动背景之间的空白区域)

    <marquee hspace=”水平范围 ”vspace=”垂直范围 ”>滚动的文字</marquee>

    创建精彩的图像和多媒体页面

      插入图像并设置图像属性

    图像标记——img

    <img src=”图像文件的地址”>

    属性            描述                属性             描述

    src              图像的源文件        dynsrc           设定avia文件的播放

    alt              提示文字             loop            设定avia文件循环播放的次数

    width,height    宽度和高度           loopdelay       设定avia文件循环播放的延迟时间

    border          边框                 start            设定avia文件的播放方式

    vspace          垂直间距             lowsrc           设定低分辨率图片

    hspace          水平间距             usemap          映像地图

    align            排列

    设置图像高度——height(如果img元素不定义高度,图片就会按照其原始尺寸显示)

    <img src=”图像文件的地址 ”height=”图像的高度 ”>

    设置图像宽度——width

    <img src=”图像文件的地址”width=”图像的宽度 ”>

    设置图像的边框——border

    <img src=”图像文件的地址 ”border=”图像边框的宽度 ”>

    设置图像水平间距——hspace

    <img src=”图像文件的地址 ”hspace=”水平边距 ”>

    设置图像垂直间距——vspace

    <img src=”图像文件的地址 ”vspace=”垂直边距 ”>

    设置图像的对齐方式——align

    <img src=”图像文件的地址 ”align=”对齐方式 ”>

    属性          描述                         属性        描述

    Bottom      把图像与底部对齐              top        把图像与顶部对齐

    left          把图像对齐到左边             right        把图像对齐到右边

    middle       把图像与中央对齐

    设置图像的代替文字——alt

       <img src=”图像文件的地址 ”alt=”提示文字的内容 ”>

     添加多媒体文件

       <embed src=”多媒体文件地址 ”width=”多媒体的宽度 ”height=”多媒体的高度 ”autostart=”是否自动运行”loop=”是否循环播放 ”></embed>

     添加背景音乐——bgsound

       <bgsound src=”背景音乐的地址 ”>

     设置循环播放次数——loop(-1是无限循环)

       <bgsound src=”背景音乐的地址 ”loop=”播放次数 ”>

    创建超链接和表单

    创建基本超链接

       超链接标记——a

        <a href=”链接目标 ”>链接显示文本</a>

       属性       说明                     属性            说明

       href       指定链接地址             title           为链接添加提示文字

       name      为链接命名              target          指定链接的目标窗口 

       设置的目标窗口(使用target 属性来控制打开的目标窗口)

        <a href=”链接目标 ”target=”目标窗口的打开方式”>

      创建图像的超链接

    设置图像超链接——a

    <a href=”链接目标 ”>链接的图像</a>

    设置图像热区链接(形状:矩形-rect 椭圆形-circle 多边形-poly)

      <img usemap=”#热区名称 ”>

      <map name=”热区名称 ”>

      <area shape=”热点形状 ”coords=”区域坐标 ”href=”#链接目标 ”alt=”替换文字 ”>

       …………………………………………………………………

      </map>

     创建锚点链接

      创建锚点:<a name=”锚点的名称 ”></a>

      链接到页面不同位置的锚点链接:<a href=”#锚点的名称 ”>……</a>

     插入表单——form

       处理动作——action(用于指定表单数据提交到哪个地址进行处理)

         <form action=”表单的处理程序 ”>

           …………………………………

         </form>

     表单名称——name

       <form name=”表单名称 ”>

    ………………………………….

    </form>

     传送方法——method

       <form method=”传送方法 ”>

    ……………………………..

    </form>

     编码方式——enctype

       <form enctype=”编码方式 ”>

         ……………………………………

       </form>

      enctype的取值                                取值含义

      application/x-www-form-ulencoded           默认的编码形式

      multipart/form-data                         MIME编码,上传文件的表单必须选择项

      目标显示方式——target

       <form target=”目标窗口的打开方式 ”>

         ……………………………………

       </form>

    创建强大的表格

      创建并设置表格属性

    表格的基本标记——table、tr、td

    <table>

       <tr>

       <td>单元格内的文字</td>

       <td>单元格内的文字</td>

       </tr>

       <tr>

       <td>单元格内的文字</td>

       <td>单元格内的文字</td>

       </tr>

       </table>

     表格宽度和高度——width、height

       <table width=”表格的宽度 ”height=”表格的高度 ”>

     表格的标题——caption

       <caption>表格的标题</caption>

     表格的表头——th

        <table>

        <tr>

        <th>…….</th>

        </tr>

        </table>

     表格对齐方式——aline(left-左对齐 center-居中 right-右对齐)

        <table aline=”对齐方式”>

     表格的边框宽度——border

        <table border=”边框宽度 ”>

     表格边框颜色——bordercolor

        <table border=”边框宽度 ”bordercolor=”边框颜色”>

     单元格间距——cellspacing

        <table cellspacing=”间距值 ”>

     单元格边距——cellpadding

         <table cellpadding=”文字与边框距离值 ”>

     表格的背景颜色——bgcolor

         <table bgcolor=”背景颜色 ”>

     表格的背景图像——background

         <table background=”背景图像地址 ”>

    设计表头样式——thead

      <thead>

       …………………………

      </thead>

    设计表主体样式——tbody

      <tbody bgcolor=”背景颜色 ”align=”对齐方式 ”>

      …………………………………………………….

      </tbody>

    设计表尾样式——tfoot

      <tfoot bgcolor=”背景颜色 ”align=”对齐方式 ”valign=”垂直对齐方式 ”>

      …………………………………………………..

      </tfoot>

    创建框架结构网页

      水平分割窗口——rows

         <frameset rows=”高度1,高度2,….,*”>

         <frame src=”url ”>

    <frame src=”url ”>

    ……………………..

    </frameset>

       垂直分割窗口——cols

          <frameset cols=”高度1,高度2,….,*”>

          <frame src=”url ”>

    <frame src=”url ”>

    ……………………..

    </frameset>

    嵌套分割窗口

           <frameset rows=”30%,*”>

           </frame>

       <frameset cols=”20%,*”>

         <frame>

        <frame>

           </frame>

           </frame>

    设置边框——frameborder

       <frameset frameborder=”是否显示 ”>

    框架的边框宽度——framespacing

       <frameset framespacing=”边框宽度 ”>

    框架的边框颜色——bordercolor

       <frameset bordercolor=”边框颜色 ”>

    框架页面源文件——src

      <frame src=”html文件的位置 ”>

    框架名称——name

      <frame src=”html文件的位置 ”name=”子窗口名称 ”>

    调整框架窗口的尺寸——noresize

      <frame src=”页面源文件地址 ”noresize >

    框架边框与页面内容的水平边距——marginwidth

       <frame src=”页面源文件地址 ”marginwidth=”value ”>

    框架边框与页面内容的垂直边距——marginheight

       <frame src=”页面源文件地址 ”marginheight=”value ”>

    设置框架滚动条显示——scrolling

       <frame scrolling=”yes 或no或auto ”>

    不支持框架标记——noframes

       <noframes>

       </noframes>

    浮动框架的页面源文件——src

       <iframe src=”url ”></iframe>

    浮动框架的宽度和高度——width和 height

       <iframe src=”浮动框架的源文件 ”width=”浮动框架的宽 ”height=”浮动框架的高 ”>

       </iframe>

    浮动框架的对齐方式——align

       <iframe src=”浮动框架的源文件 ”align=”对齐方式 ”></iframe>

    设置浮动框架是否显示滚动条——scrolling

       <iframe src=”浮动框架的源文件 ”scrolling=”是否显示滚动条 ”></iframe>

    属性                           说明

    auto             默认值,整个框架在浏览器页面中左对齐

    yes              总是显示滚动条,即使页面内容不足以撑满框架范围,滚动条的位置也会预留出

    no               在任何情况下都不显示滚动条

    浮动框架的边框——frameborder

        <iframe src=”浮动框架的源文件 ”frameborder=”是否显示框架边框 ”></iframe>

  • 相关阅读:
    图论模型--dijstra算法和floyd算法
    灰色预测模型
    多属性决策
    层次分析法
    一元多项式
    9.8一些错误的原因
    http协议笔记(不全)
    计网笔记1.18(不全)
    数据库基本操作
    flask-数据库
  • 原文地址:https://www.cnblogs.com/yan-linxi/p/7993608.html
Copyright © 2020-2023  润新知