Heim  >  Artikel  >  Web-Frontend  >  【HTML】-常用标记-新闻发布系统_html/css_WEB-ITnose

【HTML】-常用标记-新闻发布系统_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:40:221239Durchsuche

    通过学习了1集HTML,对当初新闻发布系统中的一些标签都有了更进一步的认识,感觉收获颇丰。


定义

    HTML是一种超文本标记语言。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。


元素与标签

四种基本元素:


:空元素


:带有属性的空元素

http://www.zhaohan.com:带有内容的元素

http://www.zhaohan.com:带有内容和属性的元素

例子:


运行结果:

    看到运行结果与代码中写的不一样,没有了分段。这是因为:如果存在多个空白字符(空格、制表符、回车、换行等)浏览器显示时将只解析为一个空格字符,所以出现上面效果。

这就需要我们了解一些与段落控制相关的标签:

p:paragraph。#是属性值,可以为:left/center/right/justify。


:换行


:插入一条水平线,并指定颜色。

如:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">        <title>        HTML    </title>    <p align="center">HTML</p>               <!--HTML居中-->    <p align="center">HTML 2.0?1995年11月<br></p>    <hr width="200px">                      <!--下划线,宽200px-->   <p align="center">HTML 3.2?1997年1月</p>

运行结果变为:


若想对文本做一些设计,需了解文本设置标签:

:文本居中

:设定标题,n是标题的等级,1表示最大。align设定标题的对齐方式

:设置字体、颜色

:粗体

:斜体

如:

    情况下自定义一个文件类型描述。举例来说:  <!-- 原版-->   <center> <b>为了说明文档使用的超文本标记语言标准,</b><br>
</center><!--居中+粗体-->   <i> 所有超文本标记语言文档应该以“文件类型声明”头,<br></i>       <!-- 斜体-->   <font size="19" color="red"> 引用一个文件类型描述或者必要<br></font> <!--字号:19 颜色红-->
运行效果:

    有些字符在系统中是被限制的,或有其他含义,若想输入某些特殊字符,需要引用特殊字符:



例如:牛腩新闻发布系统中:

<div id="footer">             版权所有 © 赵寒 &<a href="http://blog.csdn.net/onlybymyself" target="=blank"> 赵寒CSDN</a>        </div>         

效果:


列表

    使用

  1. 标签创建带数字编号的列表。在
      标签中使用start属性,设置起始的序号。在
    1. 标签中使用value属性,改变列表内的编号顺序。

      如:

      <ol start>
      <li value="1">不受尘埃半点侵,编就两溜青篱,春居独天下,花开五瓣,我赞你,傲然,梅。</li>    <li>不为穷困而改节,蕙为无人不芳,幽香只暗持,叶立琼枝,我爱你,清秀,兰。</li>    <li>不将悬枕畔涛声,触目千林憔悴,迸笋出苍壁,高风亮节,我敬你,廉洁,竹。</li>    <li>不愿低首茎直立,卓为霜下杰出,抱枝宁自枯,罗宅残香,我顶你,高雅,菊。</li>     </ol>

      效果:


          编号的样式也有很多种,可以通过在标签中使用type属性指定编号类型。

      参考:


      表格

      表格包括:标题、表头、表行、单元格。

      表格是通过

      元素来定义的。

      表头通过

      定义单元格用

      来定义

      标题通过

      来定义

      添加新行用

      如:

      <span style="font-family:KaiTi_GB2312;font-size:24px;">      <table border="1">       <caption>开销单</caption>              <th>日期</th>       <th>项目</th>       <th>费用</th>       <tr>           <td>2015-7-25</td>           <td>水费</td>           <td>50元</td>       </tr>   </table></span>

      效果:


          代码中,border是设定表格线的宽度。


      超链接

          语法格式为:

      如:牛腩错误页:

         <div id="footer">             版权所有 © 赵寒 &<a href="http://blog.csdn.net/onlybymyself" target="=blank"> 赵寒CSDN</a>        </div>  
          赵寒CSDN就被设定为了一个超链接,超链接的地址是:http://blog.csdn.net/onlybymyself。

          通过看了1集视频,对HTML有了进一步的了解,做牛腩的时候有些懵懵懂懂,现在对那些标签就清楚多了。都说牛腩新闻发布系统就像B/S的一个书签,看来真是这样,先从牛腩对各部分都有个初了解,然后在后面的学习过程中逐渐深入......



      版权声明:本文为博主原创文章,未经博主允许不得转载。

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn