zoukankan      html  css  js  c++  java
  • 图像的排列属性ALIGN

    图像和文字之间的排列通过align属性来设定。图像的绝对对齐方式和相对文字对齐方式是不一样的。绝对对齐文字的效果和文字的对齐一样,只有三种:居左、居中、居右;而相对文字对齐方式是指图像与一行文字的相对位置。

    • "基线"(Baseline)、"底部"(Bottom)、"绝对底部"(Absolute Bottom)效果相同,是指图像底端和文字的底端对齐。
    • 对于中文"顶端"(Top)、"文本上方"(TextTop)方式是指图像顶端和文字行最高字符的顶端对齐。
    • "中间"(Middle)方式是指图像的中间线和文字的底端对齐。
    • "绝对中间"(Absolute Middle)是指图像的中间线和文字的中间线对齐。"绝对中间"对齐方式用处比较大,文字前如有小图标,那么图标应该使用"绝对中间"对齐方式。

    基本语法

    <img src="File_name" align="Top">
    <img src="File_name" align="Middle">
    <img src="File_name" align="Bottom">
    <img src="File_name" align="Left">
    <img src="File_name" align="Right">
    <img src="File_name" align="Absbottom">
    <img src="File_name" align="Absmiddle">
    <img src="File_name" align="Baseline">
    <img src="File_name" align="Texttop">

    语法解释

    其中align的属性值如下表所示

    属性值描述
    Top 文字的中间线居在图像上方
    Middle 文字的中间线居在图像中间
    Bottom 文字的中间线居在图像底部
    Left 图片在文字的左部
    Right 图片在文字的右部
    Absbottom 文字的底线居在图片底部
    Absmiddle 文字的底线居在图片中间
    Baseline 英文文字基准线对齐
    Texttop 英文文字上边线对齐

    文件范例:9-8.htm

    通过<img>标记的align属性设定图片的排列。
    01 <!-- ------------------------------ -->
    02 <!-- 文件范例:9-8.htm -->
    03 <!-- 文件说明:设定图片的排列 -->
    04 <!-- ------------------------------ -->
    05 <html>
    06 <head>
    07 <title>设定图片的排列</title>
    08 </head>
    09 <body>
    10 <h1>主流的网页设计软件</h1>
    11 <img src="9-1.JPG" align=Left width="100" height="140">
    12 目前,网页技术进入了一个新的阶段,现在的网页再也不是图片的堆积和枯燥无味的文本了,人们现在追求的是网页的动态效果和交互性。而Macromedia公司的网页设计三剑客软件Dreamweaver、Flash、Fireworks正是交互性网页设计的杰出代表,其最新版本mx 2004继承了前期版本的优点,进行了功能的进一步整合,非常适合于网页设计和网站建设的需要。<p>
    13 <hr>
    14 <img src="9-1.JPG" align=Right width="100" height="140">
    15 目前,网页技术进入了一个新的阶段,现在的网页再也不是图片的堆积和枯燥无味的文本了,人们现在追求的是网页的动态效果和交互性。而Macromedia公司的网页设计三剑客软件Dreamweaver、Flash、Fireworks正是交互性网页设计的杰出代表,其最新版本mx 2004继承了前期版本的优点,进行了功能的进一步整合,非常适合于网页设计和网站建设的需要。<p>
    16 <hr>
    17 <img src="9-1.JPG" align=Middle width="100" height="140">
    18 目前,网页技术进入了一个新的阶段,现在的网页再也不是图片的堆积和枯燥无味的文本了,人们现在追求的是网页的动态效果和交互性。而Macromedia公司的网页设计三剑客软件Dreamweaver、Flash、Fireworks正是交互性网页设计的杰出代表,其最新版本mx 2004继承了前期版本的优点,进行了功能的进一步整合,非常适合于网页设计和网站建设的需要。<p>
    19 </body>
    20 </html>

    文件说明

    第11、14、17行分别设定了图片的排列为居左、居右和文字居中。

  • 相关阅读:
    03.友盟项目--原始日志数据生成(改进版)---redis存储 用户设备的信息
    Java中的字符集
    时间复杂度
    Hive建模
    08、Spark常用RDD变换
    06、部署Spark程序到集群上运行
    05、Spark
    04、Spark Standalone集群搭建
    02、体验Spark shell下RDD编程
    03、IDEA下Spark API编程
  • 原文地址:https://www.cnblogs.com/fireicesion/p/1786302.html
Copyright © 2011-2022 走看看