当前位置: 首页 > news >正文

web页面布局基础

目录

1.网页三剑客(缺一不可)

2.html常用的标签

    2.1.html定义---超文本标记标签语言

    2.2.html的创建和基本结构

    2.3标签结构

        单标签

        双标签

    2.4常用的标签

        常用的双标签

            【1】页面结构常用标签

            【2】页面布局常用标签


1.网页三剑客(缺一不可)


html---网页结构布局---就是毛坯房
css----对页面布局进行效果美化---装修
javascript---动态效果,数据的交互

2.html常用的标签


    2.1.html定义---超文本标记标签语言


        【超文本】---文件中可以存放文本字符,音频视频,动效,超链接等
        【标记标签】---<开始标签名称>文本内容<结束标签名称/>


    2.2.html的创建和基本结构


html---根标签(把head标签和body标签包裹)
head---头部标签(用来写css样式,link其他文件,或者做页面客户端适配)
body---主体标签(用来写页面标签,页面设计,js交互等)

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>页面名称</title>
</head>
<body></body>
</html>


    2.3标签结构


        单标签

单个标签就能表示一个完整的结构

例如:

<img>;<link>等


        双标签

需要两个标签才能表示一个完整的结构

例如:

<div></div>表示一个盒模型;<h1></h1>表示一个完整的标题


    2.4常用的标签


        单标签
        meta---设置元信息:字符格式编码,关键字,窗口
        link---关联外面文件:css文件,页签的图标

        常用的双标签


            【1】页面结构常用标签


                html---根标签
                head---头部标签
                body---主体标签
                title---标题标签


            【2】页面布局常用标签


                h  ---标题
                p  ---段落
                img---图片
                a  ---超链接
                audio---音频
                video--视频
                ul/ol ---列表
                table ---表格
                form ---表单

至于详情怎么使用可以参考以下链接HTML 教程 | 菜鸟教程

http://www.xdnf.cn/news/519031.html

相关文章:

  • 【动态规划】路径问题
  • STM32八股【9】-----volatile关键字
  • vim - v
  • Python数据可视化 - Pyecharts绘图示例
  • 中级统计师-统计学基础知识-第三章 参数估计
  • 【Linux】命令行参数和环境变量
  • 【PyQt5实战】五大对话框控件详解:从文件选择到消息弹窗
  • 【typenum】 11 私有模块(private.rs)
  • 【Redis实战篇】Redis消息队列
  • 10.9 LangChain LCEL革命:43%性能提升+声明式语法,AI开发效率飙升实战指南
  • 深入理解递归算法:Go语言实现指南
  • C44-练习
  • 全基因组关联研究揭示了脑淋巴活动的机制
  • Rstudio换皮:自定义彩虹括号与缩进线
  • Python Requests库完全指南:从入门到精通
  • 《C语言中的传值调用与传址调用》
  • 多头自注意力机制—Transformer模型的并行特征捕获引擎
  • 如何畅通需求收集渠道,获取用户反馈?
  • c++多线程debug
  • 【android bluetooth 协议分析 01】【HCI 层介绍 6】【WriteLeHostSupport命令介绍】
  • 2.1.2
  • WaterStamp —— 一个实用的网页水印生成器开发记
  • 系统启动时开启选择内核菜单
  • ctf 基础
  • tauri2项目动态添加 Sidecar可行性方案(运行时配置)
  • 机器学习-人与机器生数据的区分模型测试 - 模型融合与检验
  • 关于机器学习的实际案例
  • C++学习:六个月从基础到就业——C++20:概念(Concepts)
  • ZZW-OCCT
  • OpenAI深夜发布Codex:AI编程里程碑式突破