• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
百事可爱
一起努力鸭~~~
博客园    首页    新随笔    联系   管理    订阅  订阅
html第一部分

HTML

  1. web标准是由W3C组织(万维网)制定
  2. HTML是超文本标记语言,采用一套标记标签来描述文本,用HTML标记和纯文本组成的文件称为HTML文档
  3. 标签是由尖括号包围的关键词,分为双标签(成对出现,<html>和</html>,叫开始标签和结束标签,从开始标签到结束标签间的内容称为HTML元素)和单标签(<br/>)
    4.大多数HTML元素可拥有属性,属性可以为HTML元素提供更多信息,属性在开始标签中,以名称/值对的形式定义,属性之间以空格分隔,属性值用双引号括起来。

HTML 常用标签:

标题标签:<h1>内容</h1>

双标签,
从<h1></h1>到<h6></h6>,分六级,标题字体会加粗,字体大小依次减小,独占一行
可以添加align属性:表示水平对齐方式,align="center",指居中

段落标签:<p>内容</p>

双标签,<p></p>,内容到浏览器窗口右端自动换行,段落之间空隙明显

段内强制换行<br />

文本格式化标签

  1. 加粗(有突出强调的作用)<strong></strong>和<b></b>
  2. 倾斜 <em></em>和<i></i>
  3. 删除线 <del></del>和<s></s>
  4. 下划线 <ins></ins>和<u></u>

盒子(块级)标签<div></div>和<span></span>

无语义

  1. <div></div> 独占一行,大盒子
    2.<span></span> 跨行,小盒子

图像标签,单标签,<img src="图像的url">

  1. src属性是必须属性
  2. alt属性:当图片显示不出来时的替代文本,就是没有图片时,会出现alt的属性值,alt="一段文本"
  3. title属性:鼠标放在图片上时所出现的提示文本。title="提示文本"
  4. height和width以像素为单位,设置图片的高和宽
  5. 图片的后缀一般有:.gif .jpeg或.jpg .png

目录文件夹指的是存放网站所有的HTML文件,和相关的图片,音频等,普通文件夹,而且一般将所需的所有图片存放在imagine文件夹中

根目录指的是打开目录文件夹的第一层所得目录

相对路径:相对于当前网页的地址路径,从当前网页所在目录开始的路径

以要访问某图片为例

  1. 同一级目录:src="图片名"
  2. 上一级目录:src="../图片名",前面是两个点
  3. 下一级目录:src=" imagine/图片名", 图片在HTML文件的同级文件的子文件

绝对路径:例如:(http://www.lyu.edu.cn,)不可以省略协议前缀,一般用来连接外部资源

超链接<a href="">文本或图像</a>

  1. href属性是必须属性,href="url"
  2. target属性:用来指定链接的页面的打开方式
    target=“_self” 是默认值,链接页面在当前页面打开,就是会取代当前页面展示
    target=“_blank” 链接页面在新的页面打开,就是会另开一个页面
超链接的分类:
  1. 外部链接:用绝对地址
  2. 内部链接:用相对地址
  3. 空链接:href="#" 当不确定要链接到那个页面时,或者想使页面有超链接的效果
  4. 下载链接:href="压缩包的相对地址",地址是文件.exe或.zip形式的压缩包,当点击此链接直接下载相应的压缩包
  5. 网页元素链接:指的是文本,图像,表格,等都可以添加超链接
    例如图像上建立超链接:<a href=""><img src=""/></a>
    6.锚点链接:点击链接,可以快速定位到页面的某个位置
    需要两步:1. 建立超链接,<a href="#自定义一个标记名">文字</a>
    2.想要快速定位的位置建立:在目标位置所在的开始标签里添加一个id属性,id="自定义的一个标记名"
    ####### 特别注意锚点建立时:链接起点处的超链接中href="#自定义一个标记名",链接终点处要在开始标签添加id属性
注释标签:<!--文字-->
特殊字符
  1. 空格符: 
    2. < : &lt;
  2. > : &gt;
posted on 2021-10-15 18:55  精致猪猪侠  阅读(160)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3