HTML初始----day01
1.HTML骨架标签总结
标签名 定义 说明
html标签 页面中最大的标签,称为根标签
<head></head> 文档的头部 注意在head标签中我们必须要设置的标签是title
<title></title> 文档的标题 让页面有一个属于自己的网页标题
<body></body> 文档的主体 元素包含文档的所有内容,页面内容 基本都是放到body里面的
2.HTML标签分类
2.1常规元素(双标签)
<标签名>内容</标签名> 比如我是爸爸
2.2空元素(单标签)
<标签名/> 比如
换行的意思
3.HTML标签关系
3.1嵌套关系 父子关系 子元素最好缩进一个tab键
<head>
<title></title>
</head>
3.2并列关系 兄弟关系
<head></head>
<body></body>
3.HTML常用标签
3.1排版标签
排版标签主要和css搭配使用,显示网页结构的标签,是网页布局最常用的标签
3.1.1标题标签h(熟记)
单词缩写: head 头部.标题 title 文档标题
共分为6个等级的标题 依据总要性递减
标题文本
标题文本
标题文本
标题文本
标题文本
标题文本
3.1.2段落标签p (熟记)
单词缩写 paragraph 段落
语义:把html文档分为若干段落
文本内容
3.1.3水平线标签hr (认识)
创建网页水平线横线的标签
是单标签
3.1.4换行标签br (熟记)
如果希望某段文本强制换行显示,就需要使用换行标签
单标签
3.1.5 div和spn标签(重点)
div spn 是我们网页布局主要的两个盒子
div就是division的缩写 分区的意思 其实有很多div来组合网页
spn 跨度 跨距 范围
语法格式:
今日价格
div标签 用来布局,但是现在一行只能放一个div 一行显示一个
spn标签 用来布局,一行上可以放好多个spn 显示在一行
3.2文本格式化标签(熟记)
标签 显示效果
文字以粗体方式显示(xhtml推荐使用strong)
文本以斜体方式显示(xhtml推荐使用em)
文本以加删除线方式显示(xhtml推荐使用del)
文本以加下划线方式显示(xhtml不赞成使用u)
3.3标签属性
使用html制作网页时,如果想要让HTML标签提供更多的信息,可以使用HTML标签的属性加以设置。其基本语法
<标签名 属性1="属性值1" 属性2="属性值2" ...>内容</标签名>
<手机 颜色="红色" 大小="5寸">内容</手机>
3.4图像标签img(重点)
单词缩写 : image
语法:
<img src = "图像URL" />
该语法中src属性用于指定图像文件的路径和文件名,它是img标签的必须属性
<img />标记属性
属性 属性值 描述
src URL 图像的路径
alt 文本 图像不能显示时替换显示的文本内容
title 文本 鼠标悬停时显示的内容
width 像素 设置图像的宽度
height 像素 设置图像的高度
border 数字 设置图像的边框宽度



3.5链接标签(超链接)
语法:
<a href='跳转目标' target='目标窗口的弹出方式'>文本或图像</a>
属性 作用
href 用于指定链接目标的url地址,(必须属性)当为标签应用href属性时,它就具有了超链接的功 能
target 用于指定链接页面的打开方式,其取值有_self和_blank两种,其中_self为默认值, _blank为在新窗口打开
<a href="https://www.baidu.com" target='_blank' >你点我一下试试</a>
注意:
1.外部链接 需要添加:http://www.baidu.com
2.内部链接 直接链接内部页面名称即可,比如<a href='index.html'>首页</a>
3.如果当时没有确定链接目标时,通常将连接标签的href属性值定义为“#”(即href="#")表示该链接暂时定为一个空链接
4.综合案例 圣诞
5.拓展阅读
5.1锚点定位(难点)
通过创建锚点链接,用户能够快速定位到目标内容
创建锚点链接分为两步:
1.使用相应的id名标注跳转目标的位置(找目标)
<h3 id='two'>目标地址</h3> 你需要跳到哪个部分然后给那个部分一个标识id,找到的目标人
2.使用<a href="#id名">链接文本</a>创建链接文本(被点击的)(拉关系)我也有一个姓毕的姥爷
<a href="#two">链接地址</a> 跟人创建一个标识id,然后点击链接可以找到那个人

5.2 base标签
语法:<base target="_blank" /> 单标签
在<head></head>标签中写入
作用是给所有需要创建链接的标签新建一个窗口,方便了当需要创建很多链接的时候,每个a标签都要写target="_blank",这时只要在head体中写入一个base标签就可以了
5.3 预格式化文本pre标签(了解用的少)
<pre>标签可定义预格式化的文本。
被包围在
标签元素中的文本通常会保留空格和换行符,而文本也会呈现为等宽字体。<pre>
此列演示如何使用pre标签
对空行和空格
进行控制
</pre>
5.4特殊字符
HTML初始----day01的更多相关文章
- Python基础【day01】:初始模块(五)
本节内容 1.标准库 1.sys 2.os 2.第三方库 1.for mac 2.for linux Python的强大之处在于他有非常丰富和强大的标准库和第三方库,几乎你想实现的任何功能都有相应的P ...
- day01——python初始、变量、常量、注释、基础数据类型、输入、if
python的历史: 04年Django框架诞生了 内存回收机制是什么(面试题) python2:源码不统一,有重复的功能代码 python3:没有重复的功能代码 python是一个什么的编程语言 编 ...
- C++Primer笔记-----day01
=======================================================day01======================================== ...
- 计算机以及Python的初始
电脑的介绍 CPU:中央处理器,相当于人类的大脑 内存:暂时储存数据,速度快,造价高,断电后丢失 硬盘:长期储存数据.速度相对慢,造价相对低 操作系统:一个软件,连接计算机硬件和系统中的软件. Pyt ...
- 2DToolkit官方文档中文版打地鼠教程(一):初始设置
这是2DToolkit官方文档中 Whack a Mole 打地鼠教程的译文,为了减少文中过多重复操作的翻译,以及一些无必要的句子,这里我假设你有Unity的基础知识(例如了解如何新建Sprite等) ...
- CSharpGL(38)带初始数据创建Vertex Buffer Object的情形汇总
CSharpGL(38)带初始数据创建Vertex Buffer Object的情形汇总 开始 总的来说,OpenGL应用开发者会遇到为如下三种数据创建Vertex Buffer Object的情形: ...
- ArrayList、Vector、HashMap、HashSet的默认初始容量、加载因子、扩容增量
当底层实现涉及到扩容时,容器或重新分配一段更大的连续内存(如果是离散分配则不需要重新分配,离散分配都是插入新元素时动态分配内存),要将容器原来的数据全部复制到新的内存上,这无疑使效率大大降低. 加载因 ...
- linux系统下使用xampp 丢失mysql root密码【xampp的初始密码为空】
如果在ubuntu 下面 使用xampp这个集成开发环境,却忘记mysql密码. 注:刚安装好的xampp的Mysql初始密码是空... 找回密码的步骤如下: 1.停止mysql服务器 sudo /o ...
- python基础之初始python
初始python之基础一 一.Python 介绍 1.python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发 ...
- openfire 初始密码
openfire 初始密码 mssql2014 进入数据库,找到 ofUser 表 ,将密码字段对应的密文替换为下面的内容,则密码就是 admin ecbd03623cd819c48718db1b27 ...
随机推荐
- [转帖]gdb调试常见命令详细总结(附示例操作)
一.简介 通过gdb调试我们可以监控程序执行的每一个细节,包括变量的值.函数的调用过程.内存中数据.线程的调度等,从而发现隐藏的错误或者低效的代码,程序的调试过程主要有:单步执行,跳入函数,跳出函数, ...
- [转帖]龙芯 vs 飞腾:各种测试数据看国产CPU水平
https://zhuanlan.zhihu.com/p/99921594 2019年年末,龙芯.飞腾两大国产CPU巨头更是相继组织了规模宏大的年会,发布了新型桌面芯片及其整机产品,顿时硝烟四起.各大 ...
- RabbitMQ 测试环境的简单创建于使用 permission vhost 以及 权限简单设置
之前用docker运行起来 rabbitmq的容器了 但是今天发现有问题. 简单沟通了下 需要进行处理. 方法主要是如下 1. 运行容器: docker run --name rabbitmq -ti ...
- 参照DefenseGrid在Unity中实现合理的塔防寻路机制
前言 在一款TD游戏中,最重要的单位就两大类:防御塔(Tower)和敌人单位(Enemy).在处理敌人单位的AI行为时,最基本也是最重要的就是自动寻路.在各式TD游戏中,防御塔的攻击方式以及敌人单位的 ...
- 一文搞懂Redis
作者: 京东物流 刘丽侠 姚再毅 康睿 刘斌 李振 一.Redis的特性 1.1 Redis为什么快? 基于内存操作,操作不需要跟磁盘交互,单次执行很快 命令执行是单线程,因为是基于内存操作,单次执行 ...
- vuex4的简单使用
安装vuex cnpm install vuex@next --save 官网地址是 https://vuex.vuejs.org/zh/guide/#%E6%9C%80%E7%AE%80%E5%8D ...
- VUe2.0 和 Vue3.0 的生命周期作对比
VUe2.0 和 Vue3.0 的生命周期作对比 beforeCreate -> 请使用 setup() created -> 请使用 setup() beforeMount -> ...
- GitHubDesktop汉化和下载
GitHubDesktop下载 这玩意官网下载速度特别慢 如果不想等待的可以戳下面链接进行下载 会实时同步更新的 下载地址:GitHubDesktop下载
- SqlSugar导航查询/多级查询
1.导航查询特点 作用:主要处理主对象里面有子对象这种层级关系查询 1.1 无外键开箱就用 其它ORM导航查询 需要 各种配置或者外键,而SqlSugar则开箱就用,无外键,只需配置特性和主键就能使用 ...
- 10.5 认识XEDParse汇编引擎
XEDParse 是一款开源的x86指令编码库,该库用于将MASM语法的汇编指令级转换为对等的机器码,并以XED格式输出,目前该库支持x86.x64平台下的汇编编码,XEDParse的特点是高效.准确 ...
