html学习

最新推荐文章于 2024-09-10 14:15:01 发布

wangying28___

最新推荐文章于 2024-09-10 14:15:01 发布

阅读量258

点赞数

分类专栏：基本代码总结文章标签： html

本文链接：https://blog.csdn.net/baobaoxiong_123456/article/details/73306055

版权

基本代码总结专栏收录该内容

12 篇文章 0 订阅

订阅专栏

HTML入门

软件结构的分类

软件结构分类：
C-S结构（Client - Server 客户端-服务器端）
典型应用：
        QQ，酷狗音乐等
特点：
1.必须安装特定的客户端程序  
2.服务器软件升级，客户端的软件同步升级！

B-S结构（Broswer-Server浏览器-服务器端）
典型应用：
    公司网站，电脑淘宝、游戏官网。。。
特点：
1.不需要特定的客户（只需要浏览器软件）
2.服务器软件升级，浏览器客户端不需要升级！

html语言

html概述

html是第一门网页制作语言，最简单的一门语言。hyperText Markup Language 超文本标记语言。
html语言由标记组成。
html基础学习网站推荐：

html基础学习网站

这里使用Dreamweaver这个软件来创建html页面；

html标签

html语言主要是由标签和属性组成，属性在标签中写，主要是说明此标签的属性值是什么。
HTML文件的最基本结构，主要包含4个标记，即

<html></html>
<head></head>
<body></body>

它们的含义分别如下所述：

 <html></html>

标签限定了文档的开始点和结束点，在它们之间是文档的头部和主体。

<head></head>

标签用于定义文档的头部，它是所有头部元素的容器。

 <body></body>

定义主体，显示的内容在这里写。

html标签分类

html标签分类：
有标签体标签：有开始，有结束标签；

<title></title>

没有标签体标签：也叫空标签

<br  />

html语法

1.注释

<!-- html注释  -->

2.标题写在head中：

<head>
    <!-- html注释  -->
    <title>这是标题</title>
</head>

3.meta标签

<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。

<meta http-equiv="content-type"     content="text/html;charset=utf-8"/>

4.文本标签
文本标签(body里面的标签)
标题(h1~h6) 设置标题的大小，h1为最大，h6最小；

<h1>这里写标题1的内容</h1>

align：是属性
设置位置，值有left，right，center，justify四个值；
水平线(hr) ：就是画一条横线，属性有color，来设置水平线的颜色；
换行(br)，没有结束标签，直接是<br/>

下面这些都有结束标签，结束标签主要是用来标明你给哪些内容加这些标签；

标签规定粗体文本(b)
将文本以斜体显示(i)
将文本以下划线显示(u)
段落(p)(书写两段小说进行演示)
段落缩进(blockquote)(主要用于解释或者强调)
上下标(sup和sub)(一般用于公式)y=x2  H2O  CaCo3
原样输出(pre)(希望网页上的东西和代码里面写的样式完全一样的时候(写一首诗，写一段代码))

marquee的意思是移动字幕效果，因此被标签标记的也都会像制作广告的一样，会来回动；

        marquee:
        behavior属性值(alternata:来回滚动 scroll:重复滚动 slide:不重复滚动 
        bgcolor:字幕背景颜色 
        direction:设置字幕的滚动方向down  right  left  up

背景音乐 bgsound（backgroundsound）

        bgsound:
        src:需要播放的音乐路径（src代表source，这个我刚接触的时候一直不知道……）  
        loop=-1(无限循环)  
        autostart="true"自动播放

列表标签：
分为有序列表 ol （orderlist）
无序列表： ul（unorderedlist）
li是list，直接在li标签中写值；

项目列表标签(dl dt dd)

下拉选项：
行内标签(span)

超链接 a

显示的链接的名字

图像标签

  img常用属性：
        src :  表示图片源位置
        width: 图片宽度
        height: 图片高度
        alt:替代文本。当图片的src属性失效时，alt属性的内容就会生效
        title: 提示文本。当鼠标放到图片上面出现。

转义字符

< ：  &lt;   letter than

：     &gt;   greater than
&     ：     &amp;

版权       &copy;
商标     &reg;

表格标签（画图讲解表格标签中的各个位置代表的标签）

    标签：
    table 表格
    tr   行
    td   单元格
    th   表头
    caption  标题

    常用的属性：
        border  表格的边框
        width  宽度
        heigth 高度
        align   对齐方式。 left: 左对齐   center:居中  right：右对齐
        rowspan  行合并。把多行的单元格合并
        colspan  列合并。把多列的单元格合并

表单 form：

<form>   就是一个表单
            <input type="text">  单行输入域
            <input type="password"/>  密码输入域
            <input type="radio"/> 单选按钮
            <input type="checkbox"/> 多选按钮
            <select/>  下拉选项
            <input type="hidden"/>   隐藏域。特点：不会显示到html页面上，但可以携带数据。 
            <input type="file"/>  文件选择器
            <textarea></textarea>  多行输入域
            <input type="submit"/>  提交按钮
            <input type="button"/> 普通按钮
            <input type="reset"/> 重置按钮

具体的例子就不再举例了……