一,HTML&CSS

2023-05-16

▲一个网页是由三部分组成,分别是:

  • 结构:对应的是 HTML 语言
  • 表现:对应的是 CSS 语言
  • 行为:对应的是 JavaScript 语言

1.HTML

1)文件结构:

①文件类型说明:

HTML文件中第一行的内容,用来告诉浏览器当前HTML文档的基本信息,其中最重要的就是当前HTML文档遵循的语法标准。

HTML5版本的文档类型声明是:

<!DOCTYPE html>

②结构标签:

 ③注解:

HTML注释的写法是:  

<!-- 注释内容 -->

2)HTML语法规则:

  • 根标签有且只能有一个
  • 无论是双标签还是单标签都必须正确关闭
  • 标签可以嵌套但不能交叉嵌套
  • 注释不能嵌套
  • 属性必须有值,值必须加引号,单引号或双引号均可
  • 标签名不区分大小写但建议使用小写

3)HTML的常用标签:

注意:在上图页面中版权所有里有特殊字符,需要使用转义字符。有如下转义字符:

 

img:定义图片

  • src:规定显示图像的 URL(统一资源定位符)
  • height:定义图像的高度
  • width:定义图像的宽度

audio:定义音频。支持的音频格式:MP3、WAV、OGG

  • src:规定音频的 URL
  • controls:显示播放控件

video:定义视频。支持的音频格式:MP4, WebM、OGG

  • src:规定视频的 URL
  • controls:显示播放控件 尺寸单位:

height属性和width属性有两种设置方式:

  • 像素:单位是px
  • 百分比。占父标签的百分比。例如宽度设置为 50%,意思就是占它的父标签宽度的一般(50%)

资源路径: 图片,音频,视频标签都有src属性,而src是用来指定对应的图片,音频,视频文件的路径。此处的图片,音频,视频就称 为资源。资源路径有如下两种设置方式:

  • 绝对路径:完整路径 这里的绝对路径是网络中的绝对路径。 格式为: 协议://ip地址:端口号/资源名称。 如: 这里src属性的值就是网络中的绝对路径。
  • 相对路径:相对位置关系 找页面和其他资源的相对路径。

 ./ 表示当前路径

../ 表示上一级路径

../../ 表示上两级路径 

ul标签: 无序列表
ol标签: 有序列表
li标签: 列表项

a标签: 超链接标签:
​    target: 打开方式
​    href: 指定要跳转的链接地址

table标签: table > tr > td
tr标签: 行
td标签: 列
​    合并行: rowspan
​    合并列: colspan

form 标签: 表单标签,主要是用来向服务器提交数据
    method: 提交方式 get post
    action : 提交的路径 

input 标签:
type:
​    password: 密码框
​    text: 文本
​    submit: 提交
​    button: 普通的按钮
​​    reset: 重置按钮
​​    radio: 单选按钮 设置name属性让它们是一组
​​    checkbox: 复选按钮 

★HTML的块标签

  1. div标签: 默认占一行,自动换行
  2. span标签: 内容显示在同一行

 2.css

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

一,HTML&CSS 的相关文章

随机推荐

  • pycharm下的vc2没有代码提示(不用改文件)

    我第一次遇到cv2没有代码提示的时候也是一脸懵逼 xff0c 在网上搜索了各种解决办法 包括但不限于修改 init py文件 xff0c 复制文件 xff0c 降低opencv的版本等 xff0c 都没有用 但是最后还是参考网上建议以及自己
  • delete和delete[]的区别

    对于简单类型 简单类型像 int char int long struct等 由于对象是没有析构函数的 所以delete和delete 是一样的 int arr 61 new int 10 delete arr delete arr 两种方
  • Result Maps collection already contains value for…BaseResultMap

    异常信息 Result Maps collection already contains value for BaseResultMap 假如使用generatorSqlmapCustom逆向工程生成代码 xff0c 即生成dao文件和ma
  • Debian 11 软件最大化占不满屏幕

    原来是自己不知何时手长把 Workspace margin 给设置了 xff0c 导致软件最大会占不满全屏 就是设置 gt Workspace gt margins 把 17 改成 0 就好了 曾一度难受的想重装系统 xff0c 原来是这么
  • static静态成员

    静态成员包括 xff1a 静态成员变量和静态成员函数 一 静态成员变量 静态成员变量的特点 所有对象都共享一份数据 编译阶段就分配内存 只能在类内声明 xff0c 类外初始化 静态成员变量也是有访问权限的 1 验证 所有对象都共享一份数据
  • matlab如何删除矩阵某行或列?

    要删除矩阵某一行或某一列 xff0c 只需要将某一行或某一列赋予一个空矩阵即可 例如 xff1a clc clear close all x 61 eye 4 先创建一个4 4矩阵 xff1a x 61 eye 4 xff0c 得到 之后输
  • Excel导出 POI 响应头设置 Content-Type: application/vnd.ms-excel 异常解决方法

    386条消息 Excel导出 POI 响应头设置 Content Type application vnd ms excel 异常解决方法 刘涛 的博客 CSDN博客 application vnd ms excel charset 61
  • Android音视频技术之MediaPlayer视频窗口尺寸适配

    作者 xff1a JulyYu 前言 使用MediaPlayer播放能力后再视频播放上还有一个问题需要解决 xff0c 那就是适配尺寸适配 默认情况使用SurfaceView播放视频可能会出现视频被拉伸或是压缩的情况 MediaPlayer
  • Linux系统中管理文件的五个关键命令

    1 mkdir 创建目录 xff1a 此命令可以创建一个或多个目录或子目录 但是 xff0c 当目录已经存在或者在不存在的目录中创建子目录 xff0c mkdir命令就会失败并出现错误 mkdir p命令将会为子目录创建缺失的父目录 2 c
  • Linux——总复习1

    1 要注意自己处于当前那个目录位置 2 将file1的前五行 后三行重定向 附加到file2 输出重定向 head 5 file1 gt file2 tail 3 file1 gt gt file2 3 ls与cat区别 ls 列出目录的目
  • Linux——运行基本容器

    1 安装容器管理 使用yum命令安装container tools模块 包括工具podman和skopeo yum module install container tools 2 选择容器镜像和注册表 xff08 1 xff09 容器注册
  • Linux——查找并管理容器镜像

    1 配置容器注册表 xff08 1 xff09 posman使用主机系统上的registries conf文件来获取有关它可以使用的容器注册表的信息 文件中 registries insecure 部分中列出了不安全的注册表 xff08 2
  • Linux——RHEL8的启动过程

    xff08 1 xff09 接通电源 xff0c 系统固件运行开机自检 xff0c 并初始化部分硬件 xff08 2 xff09 系统固件搜索可启动设备 xff08 3 xff09 系统固件从磁盘读取启动加载器 xff0c 将系统控制权交给
  • Ansible——介绍ansible

    1 什么是ansible xff1f ansible是一款开源自动化平台 xff0c 基于python开发 xff0c 可以多节点发布 远程任务执行的自动化引擎 xff0c 可以实现批量系统配置 批量程序部署 批量运行命令等 2 ansib
  • WSL2 Ubuntu Can‘t open display解决方法

    使用MobaXterm开启Ubuntu后 xff0c ncview打开文件时报错 xff1a MoTTY X11 proxy Unsupported authorisation protocol Error Can 39 t open di
  • Ansible——部署ansible

    1 ansible清单 清单 xff1a 定义ansible将要管理的一批主机 xff0c 可以通过在静态文本文件中定义或外部来源获取信息的脚本来动态确定 xff0c 因此 xff0c 分为静态主机清单 xff08 包括INI或YAML样式
  • nltk安装出错,nltk_data语料库下载

    首先 xff0c 安装nltk要有nltk库和nltk数据包 xff0c 下载方法网上也很全面 但本文是在在使用nltk中的语料库omw 1 4 主要用于词性还原 xff0c 无法找到对应文件 环境 xff1a pycharm 3 1 An
  • Ubuntu ver.22.04.2 root用户登录

    ps xff1a 因为站内的多种方法需要的文件 xff0c 我的白板机没有 xff0c 于是提供下自己的解决思路 补充 xff1a 一种可能的方法 xff1a 打开终端 xff0c 键入sudo i 回车 xff0c 并输入当前账户的密码
  • go语言中time包基础内容

    目录 一 介绍简单的几个时间UTC CST CDT 二 获取时间的函数 三 时间的加 减 等 四 判断两时间发生前后 五 周期性定时器 time Tick 时间间隔 六 时间也有格式化 七 时间字符串格式的解析 八 时区 xff08 tim
  • 一,HTML&CSS

    一个网页是由三部分组成 xff0c 分别是 xff1a 结构 xff1a 对应的是 HTML 语言表现 xff1a 对应的是 CSS 语言行为 xff1a 对应的是 JavaScript 语言 1 HTML 1 xff09 文件结构 xff