zoukankan      html  css  js  c++  java
  • HTML学习(一)

    js笔记

    一、HTML基本学习

    1.1.什么是HTML?

    百度百科:

    HTML: Hyper Text Markup Language 超文本标记语言

    说人话:

    HTML就是一款功能比".txt"文件更强大的语言,它自定义了一些标签可以使页面做到纯文本语言做不到的事情。比如:<image>标签可以内嵌图片,又如<table>标签可以展示表格数据。

    大家都用过.txt文件,它是一个纯文本语言,里面只能使用一些中文语言、英文语言以及一些常见的符号,不能插入图片、不能使用链接等等。而HTML就是功能比纯文本语言更强大的语言,这就是“超文本”的来源。

    其次,HTML自定义了一些标签,如<image><table>标签等,可以在页面内展示图片数据表格数据等,这就是“标记”的来源。因此HTML是一个“超文本标记语言”。

    1.2.HTML的作用是什么?

    记住这几句话:

    HTML: 决定了页面的框架 -------》 用来展示数据 ---------》相当于一堆家具随意堆砌的房子

    CSS: 用来美化我们的页面 -------》 用来美化页面 --------》让房子内的家具有条理的摆放

    JS: 提高用户的交互体验--------》使页面具有简单的动态效果 --------》智能家具,住的更舒适

     

    1.3.HTML语法规范

    <!DOCTYPE html>
        <html>
            <head>
            <title>文档的标题</title>
            </head>
    
        &lt;body&gt;<span style="color: #000000;">
        文档的内容......
        </span>&lt;/body&gt;
    
    &lt;/html&gt;</pre>
    

    1. 最上面是一个文档声明
    2. 根标签 html
    3. html文件主要包含两部分. 头部分和体部分
      头部分 : 主要是用来放置一些页面信息
      体部分 : 主要来放置我们的HTML页面内容
    4. 通过标签来对内容进行描述,标签通常都是由开始标签和结束标签组成
    5. 标签不区分大小写, 官方建议使用小写

    注意:

    1.3.1 .关于'<!DOCTYPE>'的定义

    '<!DOCTYPE>' 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。

    '<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

    在 HTML 4.01 中,<!DOCTYPE> 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则,这样浏览器才能正确地呈现内容。

    HTML5 不基于 SGML,所以不需要引用 DTD。

    提示:请始终向 HTML 文档添加 <!DOCTYPE> 声明,这样浏览器才能获知文档类型。

    1.3.2.HTML 4.01 与 HTML5 之间的差异

    在 HTML 4.01 中有三种 <!DOCTYPE> 声明。在 HTML5 中只有一种:

    <!DOCTYPE html>

    1.4.一张图搞定HTML常用标签

    二、扩展

    2.1 字体扩展

      b : 加粗

      i : 斜体

      strong: 加粗, 带语义标签

      em: 斜体, 带语义

    2.2 文件路径扩展

    • 相对路径

     

        ./        代表的是当前路径
        ../       代表的上一级路径
        ../../    上上一级路径

    2.3 表格扩展

      表格标签table

      table标签:

      常用的属性:

        bgcolor : 背景色

        width : 宽度

        height : 高度

        align : 对齐方式

      tr 标签

      td 标签

    合并单元格:

    colspan : 跨列操作

    rowspan : 跨行操作

    注意: 跨行或者跨列操作之后,被占掉的格子需要删除掉

     

    表格的嵌套:

    在td中可以嵌套一个表格

     

    2.4 表单扩展

    表单标签

    <!--
                表单标签
                    action : 直接提交的地址
    
                method : 
                        get 方式  默认提交方式 ,会将参数拼接在链接后面 , 有大小限制 ,4k
                        post 方式  会将参数封装在请求体中, 没有这样的限制
                        
            
            input :
                type: 指定输入项的类型
                    text : 文本
                    password :  密码框
                    radio :        单选按钮
                    checkbox :  复选框
                    file      : 上传文件
                    submit   : 提交按钮
                    button      : 普通按钮
                    reset     : 重置按钮
                    hidden  : 隐藏域
                    
                    date    : 日期类型
                    tel     : 手机号
                    number   : 只允许输入数字
                    
                placeholder : 指定默认的提示信息
                name : 在表单提交的时候,当作参数的名称
                id : 给输入项取一个名字, 以便于后期我们去找到它,并且操作它
            
            textarea : 文本域, 可以输入一段文本
                        cols : 指定宽度
                        rows : 指定的是高度
            
            select  : 下拉列表
                option : 选择项
        </span>--&gt;</pre>
    
  • 相关阅读:
    线程同步技术
    线程调用
    进程与线程
    网络配置
    vi
    文件系统
    系统管理命令
    Linux常用命令
    Shell编程
    新版chrome touch警告处理办法
  • 原文地址:https://www.cnblogs.com/tianwenxin/p/13986788.html
Copyright © 2011-2022 走看看