zoukankan      html  css  js  c++  java
  • HTML学习笔记1_网站信息页面显示

    1. HTML介绍

    1. 什么是HTML

    HTML是超文本标记语言。

      超文本:比普通文本功能更加强大

      标记语言:使用一组标签对内容进行描述的一门语言,它不是编程语言(不需要进行编译,直接通过浏览器解析就可以执行)。

    2. 如何使用HTML

    语法和规范:

    1.所有的html文件的后缀名都是以.html或者.htm结尾的,建议使用.html结尾。

    2.整个html文件分别由头部分<head></head>和体部分<body></body>组成。

    3.Html标签都是由开始标签和结束标签组成(也有例外,如:<br />换行)

    4.Html忽略大小写的,建议使用小写。

    3. HTML相关标签的学习

    3.1 标题标签

    标题标签使用<hn></hn>,n从1到6逐渐变小。如<h1></h1>,超过6的按6进行显示

    特点:加粗加黑显示,单独占用一行。与其他行有一定的行间距。

    注释:<!---注释内容--->

    快捷键:ctrl+/

    3.2 水平线标签

    水平线标签<hr />

    size属性:水平线高度,单位像素

    noshade属性:没有阴影,取值:noshade,表示显示纯色

    <hr  size="5" />

    <hr  noshade="noshade" />

    3.3 段落标签

    段落标签:<p></p>

    特点:段落标签内的内容是单独的一块内容,与该段的上下方内容都有一定的间距。

    3.4 字体标签

    1. 字体样式设置标签:<font></font>

      color属性:设置字体的颜色(可以是英文单词也可以是十六进制),如:color="#0000FF"、color="red"

      size属性:设置字体的大小(从1到7逐渐变大,超过7的部分按照7来显示,如:size="3"

      face属性:设置字体的类型(字体类型必须是你本机已经有的),如:face="arial black"

      注意:使用font标签时要结合font标签的属性来进行设置,如果单独使用<font></font>没有任何效果。

    2. 字体加粗标签:<b></b>

    3. 字体倾斜标签:<i></i>

    2. 网站图片信息显示页面

    1.图片标签

    图片标签:<img />

      图片的位置属性:src

        SRC:

          绝对路径:带有盘符的

          相对路径:

            1.如果是同级,直接写文件名称或者./文件名称

            2.如果上一级:../文件名称(如果是多层,那么多写几个../) 

            3.如果是下一级:写目录名称/文件名称

       width:设置图片的宽度

       height:设置图片的宽度

       alt:当图片无法正常显示的时候给出的提示信息。

    3.网站友情链接页面显示

    1.列表标签

      有序标签:<ol></ol>

      属性:type有5个取值    start起始位置  reverse:倒序

      无序标签:<ul></ul>

      属性:type有3个取值

    2.超链接标签

      <a href=" " target="_self/_blank">点我</a>

           #表示是超链接但是不会跳转

    4.网站首页显示页面

    1.表格标签

    表格标签使用的是<table></table>

    <table>

      <tr>

        <td></td>

      </tr>

    <table>

    Table属性:

      边框:border

      宽度:width

      高度:height

      背景颜色:bgcolor

      边框与边框之间的距离:cellspacing

      边框与内容之间的距离:cellpadding

      居中显示:align

    表格的跨行、跨列操作是真对单元格的(对<td></td>标签的操作)

         

     

     

    4.补充说明

    HBuilder的一些快捷键:

    1.快速选中一行:shift+end

    2.整理代码格式:ctrl+shift+F

    3.加注释:ctrl + /

    附录

    【1】HBuilder的使用方法:https://www.runoob.com/w3cnote/hbuilder-intro.html

    【2】HTML基础教学文档:https://www.w3school.com.cn/html/index.asp

  • 相关阅读:
    e3.tree参考手册
    fckeditor使用详解
    提示constructor无法location的原因
    无限联动下拉框使用步骤
    动态sql构建的过程
    xsqlbuilder使用说明
    处理date类型对象的方式
    wdatepicker使用指南
    How to reclaim space in InnoDB when innodb_file_per_table is ON
    Bash script: report largest InnoDB files
  • 原文地址:https://www.cnblogs.com/lty1661489001/p/12387615.html
Copyright © 2011-2022 走看看