zoukankan      html  css  js  c++  java
  • Html常用标签的应用

          开班已经三天了,从一开始的什么都不懂,一脸懵逼的状态/(ㄒoㄒ)/~~,到现在对基础的掌握,内心感到非常的高兴,这不今天开始了新的内容.

          首先从<a></a>标签开始,它包含超级链接<a href="URL"></a>,然后就是锚点的应用了,首先建立个a标签,也就是<a name=''top''>2</a>,然后在下面建立个内容用P标签,也就是<p>1</P><p>1</P><p>1</P><p>1</P><p>1</P><p>1</P><p>1</P>,然后为了实现锚点的作用就在<P></P>标签下面用a标签实现,如果想返回到2,那么就建立<a href="#top">返回</a>的标签,如果想返回到顶部就用<a href="#">返回顶部</a>,标签来实现就可以了.

          那么a标签还具有下载的功能,比如像下载个压缩包,首先先建立一个download的文件夹,然后在download下面建立123的压缩包形式的文件,然后就可以操作下载压缩包的代码了,首先编写代码<a href="download/123.rar">点击下载</a>,能下载压缩包,那么就可以下载图片,所以代码可以这么写<a href="img/123.jpg">点击下载 图片</a>,说到图片不得不说,有的时候网速不好,图片会有不能观看的情况,那么为了防止这种情况发生可以弄alt标签来给他添加备注,而且有的时候有人想在图片上显示字,那么可以用title标签来实现.

          比如我想弄一个宽200,高100,并且让他在网速不好的时候显示他是个图片,和鼠标移到图片上会显示你很帅的字样,那么你可以这么编码来实现这个功能<img src="img/123.jpg" width="200" height="100" alt="这是图片" title="你很帅" />,学完a标签那么自然会用到文章,那么文章就会有序号,和内容,那么自然会用到有序标签,和无序标签,所以接下来将来学有序和无序的标签。

             说到有序标签那么就会用到ol标签,那么先建立ol标签,在ol标签中又li标签,所以如下<ol><li>第一行</li></ol>,其中在ol标签中可以添加功能,比如像是type功能他可以实现前号的表示,比如type=''a'',那么你的内容面前就会出现有序的adcde等.

             既然有有序标签,那自然少不了无序标签,无序标签用ul来表示,那么在ul标签中自然也有type功能,在无序标签里面有disc空心圆,square方形,circle空心圆的应用,自然可以在段落面前加空心圆等标签那么就可以将他们删掉,删掉的时候就要用到style=''list-style:none''编码了,用这个可以将段落面前的序号删掉,除了这些,还学了一些小标签,比如,<hr/>标签起到分隔符的作用,不得不说空格这个标签和有意思,&nbsp,为了好记可以说是牛比sp,换行标签用<br/>来表示. 将今天学的编码整理如下:

    <body>

       <a href="Htmljichu.html">超级链接</a>

       <br />

       <a name="top">2</a>

       <p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p><p>1</p>1</p>

       <p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p>

       <p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p>

       <a href="#top">返回</a><a href="#">返回顶部</a><br />

       <a href="download/123.rar">点击下载</a><br />

       <a href="img/123.jpg">点击下载 图片</a><br />

       <img src="img/123.jpg" width="200" height="100" alt="这是图片" title="无形之刃最为致命" />

       <ul type="square" style="list-style:none">

         <li>第一行</li>

         <li>第二行</li>

         <li>第三行</li>

        </ul>

        <ol type="a">

         <li>第一行</li>

         <li>第二行</li>

         <li>第三行</li> <!-- &nbsp;代表空格-->

        </ol>

             <hr /> <!--分隔符-->

    </body>

              

      

  • 相关阅读:
    模板方法设计模式
    单一职责原则
    开闭原则
    uml
    迭代器模式
    观察者模式
    工厂模式
    代理模式
    idea本地Maven仓库不能下载依赖jar包的解决方案
    selenium 使用教程详解-java版本
  • 原文地址:https://www.cnblogs.com/yujiamin123/p/6820495.html
Copyright © 2011-2022 走看看