HTML和CSS(三)

10 篇文章 0 订阅

第三章 构建模块——网页创建


一、元素

1.引用:<q>

   用<q>标记引用来添加额外的信息:

          在添加<q>之前,浏览器只知道一段文字和一些双引号在里边。

          使用了<q>,浏览器就能知道哪些才是真正的引用,就会以尽量好的方式显示它们。如:某些浏览器会在文字周围显示双引号;在浏览器没有使用英文是用其他方法;移动设备(电话),为视力有障碍的人士准备的HTML视频浏览器;其他场合,如搜索引擎寻找带引用的网页。

          使用<q>后能安装你的意愿样式化引用(利用CSS,在引用时灰色斜体)

   注:某些浏览器(如:IE6.0)对<q>元素包围的文字周围不显示双引号;某些浏览器会显示两组双引号。

          解决办法:使用CSS给引用增加视觉样式(如:斜体)。

2.块引用:<blockquote>

   创建一段单独的文字,文本有缩进

   段落<p>结束之后才能插入<blockquote>元素

   和<q>区别:

         <q>:内联元素,简短地“引用”现有文字中的一部分(在文字中夹杂一点引用)

          <blockquote>:块元素,引用大段文字并独立显示(引用一段或更多文字)

3.换行:<br>

   <br>没有任何内容

4.列表:<li>  <ol>  <ul>

   1.把每个列表项目放进一个<li>元素(list item)中(确定每一个元素)

   2.用<ol>或<ul>封装列表元素(把元素组成一组)

         <ol>:有序列表(ordered list)

         <ul>:无序列表(unordered list)

   注:<li>  <ol>  <ul>都是块元素

          <ol>  <ul>放在<p>外

          有序列表的标号:

              <ol>的属性type:1(阿拉伯数字);a(小写字母);A(大写字母);i(小写罗马数字);I(大写罗马数字)

              <ol>的属性start:数字或字母,规定开始的数字或字母

              <li>的属性value:整数,指定某一个列表元素的标号

          无序列表的样式:

              <ul>的属性type:disc(小的实心圆);circle(空心圆);square(实心矩形)

    嵌套列表:在列表中添加列表

                       用<li> <ol>或者<li> <ul>组成内容

   自定义列表:<dl> <dt> <dd>

       列表中每个项目都有一个项限<dt>和一个描述<dd>

   为什么不用<p>做列表:

       HTML有专门做列表的元素。如果使用它,浏览器就知道这段文字是列表,并尽可能用最佳方式显示它。

       <p>元素代表文本段落而不是列表。

       它可能看起来不像一个列表,而像一堆标了号的段落。

       如果想改变列表的顺序,或者插入新项目就彼此重新标号。

5.建立链接:<a>

6.段落:<p>

7.强调:<em>

8.着重强调:<strong>

9.着重号:<dnf>

10.粗体:<b>

11.斜体:<i>

12.增大字体:<big>

     每使用一次,字体增大一个单位

     默认为3,最大为7

13.减小字体:<small>

14.字体:<font>

     大小:font    颜色:color    字体:face

     <font size="1~7">    <font size="+数字">    <font size="-数字">

15.下划线:<u>

16.地址:<address>

17.水平标尺:<hr>

     无结束标记,不包含任何内容

     绘制一条水平线

     属性:不赞成使用,请使用样式取代它。

              noshade(规定 hr 元素的颜色呈现为纯色。)

               size(高度;pi)

               align(对齐方式;值:center left right)

               width(宽度;pi %) 

18.格式化文本:<pre>

     文本以预定义的格式显示,文本显示时遵循在HTML源文档中定义的格式。

二、块元素和内联元素

块(block)元素:前后都有换行符(如:<blockquote>)

内联(inline)元素:在网页中随着文字流出现在行内(如:<q>)

块元素是网页的主要结构模块,而内联元素则用来标记内容的小片段。

三、空元素

空元素:没有HTML内容的元素,只需要写一个开始标记

如:<br>  <img>

四、嵌套

把一个元素放到另一个元素中

五、字符实体

如:>  &gt;

        THE <html> element rocks  =》The  &lt;html&gt; element rocks

       &  &amp;

       缩进 &nbsp;

详见:http://www.w3schools.com/tays/ref-entities.a2P

           http://www.unicode.org/charts/

六、要点

  1. 在输入内容之前先计划好网页的结构。先画草图,再绘制略图,最后写HTML。
  2. 用大的块元素来创建你的网页,然后用内联元素修饰。
  3. 无论什么时候,使用元素来告诉浏览器你的内容的含义。
  4. 通常使用最能匹配内容含义的元素(如,需要列表时绝不用段落表示)。
  5. <p> <blockquote> <ol> <ul> <li>都是块元素,它们独立显示,文本前后有空行。
  6. <q> <em> <a>都是内联元素。这些元素的内容和其他内容一起跟随在文字流中。
  7. 换行<br>是一个空元素。
  8. 空元素没有内容,仅由一个标记组成。
  9. 嵌套元素是一个完全包含在另一个元素中的元素。如果你的元素嵌套正确,所以标记都会正确地匹配。
  10. 结合使用两个元素创建HTML列表:使用<ol> <li>创建有序列表;使用<ul> <li>创建无序列表。
  11. 可以用start属性指定你的列表顺序。用value属性改变每一个项的值。
  12. 可以在<li>中嵌入<ol>或<ul>来建立嵌套列表。
  13. 在HTML中使用实体来显示特殊字符。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值