zoukankan      html  css  js  c++  java
  • HTML入门(转义字符、行内样式和块级元素、定位、锚点、跑马灯标签、图片标签、表格标签的讲解)

    一、转义字符
    由特殊字符包裹的文本 会当做标签去解析
     对应不换行空格
     对应全角空格 em是字体排印学的计量单位,相当于当前指定的点数。其占据的宽度正好是1个中文宽度,而且基本上不受字体影响。
    &lt;对应<

    &gt;对应>

    二、行内元素和块级元素
    1.块级标签
    默认情况下,每一个块级元素都是独占一行的即元素的前后都会换行 都有 align 属性,例如:

      p标签    段落标签

      h1~6标签   标题标签

      hr标签     水平分割线标签

      div标签    块级元素

    2.行内标签

    不会换行可以和其他的标签或文本在一行内显示,例如下列标签:

      strong标签或者b标签都表示加粗标签

      em标签或者i标签都表示倾斜标签

      s标签或者del标签都表示删除标签

      sup表示上标标签

      sub表示下标标签

      span被用来组合文档中的行内元素。

    注意事项(编程规则)

    p标记不能嵌套块级元素 w3c的规范

    一个段落里面不能放另外一个文章

    三、web浏览器

    谷歌 GOOgle Chrome

    火狐 fireFox

    IE

    欧朋 Opera

    苹果 Safari

    四、超链接标签

    <a href = "http://www.baidu.com" target=""></a>

    URL 统一资源定位符

    三种表现:绝对路径

         解释:从文件所在的最高级目录下开始的完整路径

            1.1访问互联网上的资源

            1.2访问本机的资源

         相对路径

         解释:文件所在的位置开始查找 资源文件所在的位置经过的路径

            2.1当前文件和资源文在同目录下 直接可以用名称引用

            2.2资源文件在当前目录的子目录中 先进入,再引用

            2.3 资源文件在当前文件的父目录中 先返回 再引用 ../ 返回上一级,多层返回上一级以此类推,例如:../../../../../

         根相对路径

         在服务器上面使用的,只有服务器端才能用得到

         表现/作为开始

         例如/img/ben.jpg 在项目中先找到一个img的文件夹 再找ben的图片

    锚点:

    作用: 在网页中的任意位置添加记号 可由任意位置跳转到该记号

    使用:1.定义锚点

        a标签的 一个属性 name

        其他标签里面用 id 属性

       2.在另外一个地方跳转

       <a href="#记号的名称"></a>

    五、跑马灯标签

    作用:将文本在页面上流动显示(滚动播放)

    用法: <marquee>内容</marquee>

    属性:滚动速度 scrollamount,值越大,滚动速度越快 一般5-10比较适宜消息观看

       滚动方式 behavior,3个值 scroll-循环滚动 slide-只滚动一次 alternate-来回滚动 默认循环滚动

       滚动方向 direction,滚动方向 direction 4个值 up down left right 默认从右向左

       滚动循环 loop,默认值-1或infinite 表示无限循环滚动 loop="数值" 表示滚动相应的次数

       滚动背景颜色 bgcolor

       滚动空间 hspace-水平边距 vspace-垂直边距

       滚动延迟 scrolldelay,值越大,滚动速度越慢,通常不设置

    六、图片标签
    作用:在页面上 添加一张图片
    用法: <img src="提取图片的地址" width="宽度" height ="高度" align="相对于左右文字的位置">
    图片的格式: jpg有损压缩 png无损压缩的图片支持透明度 gif动图

    七、表格
    1、表格的作用

    按照一定的格式摆放数据

    表格是由一些被称为单元格的矩形框组成

    按照从左到右,从上到下的顺序排列到一起组成的。

    2、创建表格

    1.定义表格 table(定义一个完整表格范围)

    2.创建行 tr(行)

    3.创建单元格td(单元格)

    3、表格属性

    table属性
        border:边框
        cellpadding:单元格的内边距(单元格边框与内容之间的距离)
        cellspacing:单元格的外边距(单元格之间的距离)
        宽度
        height:高度
        align:对齐方式(整个表格)
        bgcolor 背景颜色(纯色填充)
        bordercolor 边框颜色
        background: 背景图片


    tr属性(行)
        tr是没有宽高属性的
        align:水平对齐方式(内容)
        valign:垂直对齐方式

    td属性(单元格)
        width :每个单元格的宽度
        height:每个单元格的高度
        align:水平(单个单元格的内容)
        valign:垂直

    不规则表格的创建
      1.跨行 rowspan属性 纵向向下 包含自己
      2.跨列 colspan属性 横向向右 包含自己

    表格标题
    语法:<caption></caption>
    注意:表格标题必须跟在 table后面 而且最多只能有一个。

  • 相关阅读:
    根据IP定位用户所在城市信息
    Laravel根据Ip获取国家,城市信息
    基于thinkphp实现根据用户ip判断地理位置并提供对应天气信息的应用
    Linux利用OneinStack搭建环境
    五大主流浏览器及四大内核1
    手机QQ浏览器属于代理服务器吗?
    各种浏览器怎么换ip
    微信浏览器到底是什么内核?
    交谈10要素,
    广告行业的大数据处理架构实践
  • 原文地址:https://www.cnblogs.com/MDZZZ/p/11991616.html
Copyright © 2011-2022 走看看