zoukankan      html  css  js  c++  java
  • 【2017-03-20】HTML基础知识、文字标记、图片标记、空格换行、表格、表格嵌套及布局、超链接

    一、HTML基础知识

    HTML: 网站(站点) - 网页

    网站是由一个或者多个网页组合起来的

    HTML作为文件后缀名,可以把文件变为网页

    HTML是一门编程语言的名字:超文本标记语言

    超越了文字的范畴,除了文字还可以有图片、视频、音频、动画特效等其它内容,由标记(<>)组成的一门计算机编程语言

    HTML语言的作用:制作网页

    基本格式:

    <html>

              <head></head>               <!--“头”是整个html的“灵魂”-->

              <body></body>               <!--“身体”是整个html的所展示出来的内容-->

    </html>

    注释编写方式:<!--注释的内容-->

    二、标记

    1、文字标记

    加粗:<b></b>

    倾斜:<i></i>

    下划线:<u></u>

    加颜色、字号、字体:<font color="" size="" face=""></font>        <!--color引号内可以写颜色的英文或者颜色的编码、size是1-7、face写黑体或者微软雅黑等-->

    2、图片标记

    <img src="相对路径" width="200" height="10" title="" />           <!--如果想等比放大或缩小只需控制一个尺寸就好,另一个并不需要填写。-->

                                                                                               <!--title是图片标签,显示效果:将鼠标放置到图片上会显示该图片对应的标签的内容-->

    三、空格、换行

    1、空格:&nbsp;

    2、换行:<br />

    3、段落标记:<p></p>

    四、表格

    1、格式

    <table>

          <tr>                                                   <!--tr对应的是行-->

                 <td></td>                                  <!--td对应的是单元格-->

                 <td></td>

                 <td></td>

          </tr>

          <tr>

                 <td></td>

                 <td></td>

          </tr>

    </table>

    以上所创建出来的表格是两行,第一行有三个单元格,第二行有两个单元格

    2、属性

    border - 边框粗细
    width - 宽度 px %
    height - 高度
    align - 水平排列格式     center/left/right
    valign - 垂直排练格式    top/bottom
    bgcolor - 背景颜色
    background - 背景图片

    cellspacing - 单元格之间的间距 外间距
    cellpadding - 内容与单元格之间的间距 内间距

    3、去掉浏览器界面中表格四周的空白边框:

    在<head></head>中敲上如下代码即可实现:

    <style type="text/css">
    * {
    padding: 0px;
    margin: 0px;
    }
    </style>

    五、超链接

    <a href="链接" target="_blank"> 文字/图片 </a>

    两个尖括号之间的文字或图片是显示出来的超链接按钮。

    链接地址如果是公共网站必须加https://

    链接地址如果是本地地址,则需要相对路径。

  • 相关阅读:
    关于php,python,javascript文件或者模块导入引入的区别和联系
    es6在网页中模块引入的方法
    pip3 升级失败的解决方法!亲测有效
    php 简单的学习GD库绘制图片并传回给前端实现方式
    session与cookie的区别以及HTML5中WebStorage理解
    二次开发项目集合
    php微信公众号开发入门小教程
    安装运行mariadb时错误:gtid_slave_pos
    发测试 HTML/FILE/MYSQL/动态 20151120
    百度浏览器 自动弹窗!
  • 原文地址:https://www.cnblogs.com/qq609113043/p/6592316.html
Copyright © 2011-2022 走看看