正式学习第一天下午——基础标签及其属性

今天下午学习了html中的基础标签及其属性。以下面的HTML代码为例。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>这是网页的标题</title>
      </head>
  <body bgcolor="#CCFF00" background="../../动态壁纸/壁纸1/罪恶王冠/preview.jpg" text="#33CC66">
    	    这是一段测试文字
            <font size="+3" face="微软雅黑"  color="#000000">这是另一段font中的测试文字</font>
		    <b>加粗</b>
            <i>倾斜</i>
            <u>下划线</u>    	
            <b><i><u>加粗倾斜下划线嵌套</u></i></b>
      </body>
</html>

标签,是网页的最小单元,html由一个个标签组成。

<!DOCTYPE> 首先,是一个html网页开头的会有 一个<!DOCTYPE>单标签。<!DOCTYPE>标签的作用是让当前网页来适应新的标准,表示适应HTML5.0。

<html>

然后是<html>标签,用来告诉浏览器这是一个HTML文档,<html>是网页的开始,</html>是网页的结束。

<head>

相当于网页的头部,主要放控制性的东西,用于定义HTML文档的头部信息,也称为头标签。head标签定义的并不会给用户呈现。主要用来封装其他位于文档头部的标记。

<body>

相当于网页的身体,也称为主体标签。所有网页显示给用户的内容,文字图片视频等都在body中。

<body>标签的常用属性:

bgcolor="#CCFF00"      bgcolor属性用来定义网页的背景颜色

background="../../动态壁纸/壁纸1/罪恶王冠/preview.jpg"    background属性用来定义网页的背景图片

text="#33CC66"    text属性用来定义网页的前景颜色,也就是文本颜色。

<meta>

单标签元素,放在<head>头标签中,说明了一些当前网页的信息,做了一些格式的控制,说明当前网页是什么格式是怎么样的。

<meta>中  content="text/html; (说明当前的文档是一个HTML文档)charset=utf-8" 说明当前文档的编码格式是utf-8。

<title>

用来显示网页标题。

文本格式控制类标签

文本格式控制类标签

<font>:

<font>主要用来放文字,其中的文字可以通过属性来来控制

size:文字大小

face:文字字体,可以直接写字体名称,HTML常用字体  微软雅黑

color:文字颜色

<b>文字加粗

<i>文字倾斜

<u>文字加下划线

<b><i><u>三个标签可以通过嵌套来使其中的内容同时实现三种效果。

拓展知识:

编码知识:

因为计算机磁盘用二进制来存储数据,所以文字图片等需要编码成能够存储的内容才能存储。从而形成了各种不同的编码格式。编码格式错误可能会导致网页出现乱码。

网页中颜色表示:

1.rgb(255,255,255)

  其中,r=red=红,g=green=绿,b=blue=蓝,红绿蓝三原色,用0-255代表每一个颜色的浓度,来组合出不同的颜色。

  2.#000000

  #后面用十六进制字符来表示红绿蓝三元色,十六进制是0-F十六个字符,00最低,FF=255最浓。

  3.直接用red、blue等单词来表示颜色。

网页中的路径:

绝对路径:从根目录(/)开始写的路径

  相对路径:相对于某个地方(当前文件位置)的路径

  ./  代表当前目录

  ../ 代表上一级目录

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏V站

自适应丨Html5响应式(自适应)网页设计

viewport是网页默认的宽度和高度, 上面这行代码的意思是:网页宽度默认等于屏幕宽度(width=device-width), 原始缩放比例(initia...

67150
来自专栏从零开始学 Web 前端

html学习笔记(一)

单标签 <! Doctype html> 双标签 <html> </html> <head></head> <title></title>

71850
来自专栏python3

body标签中相关标签

字体标签包含:h1~h6、<font>、<u>、<b>、<strong><em>、<sup>、<sub>

18010
来自专栏极客生活

数据分析Excel之常用快捷键

下面是mac下常用的的excel快捷键,其中Cmd在windows下对应Ctrl键

9510
来自专栏偏前端工程师的驿站

JS魔法堂:通过marquee标签实现信息滚动效果

一、前言                                      有限的空间展现无限的内容,这是滚动最常用到的地方。根据信息滚动效果我们可以有...

27470
来自专栏企鹅号快讯

前端学习自学笔记:day10

今天是第十天的笔记,主要是HTML和CSS的,希望大家支持~ ? 在此之前先为大家显示下前端工程师的路线图: 第十天的笔记:HTML AND CSS: 响应式设...

20470
来自专栏大数据钻研

初识HTML之基础篇

前端认知 ---- 一、公司开发流程 1、 产品需求(产品经理给需求文档) 2、项目设计(视觉设计师给PSD文件,交互设计师配合) 3、前端开发 ...

33040
来自专栏数据小魔方

创意九宫格图片制作技巧!

今天给大家分享九宫格照片的制作技巧! ▽ 是不是每次看到朋友圈有人发九宫格图片 都觉得特别羡慕 其实这种图片可以自己制作 步骤也不复杂 下面交给大家三种制作方法...

57390
来自专栏lzj_learn_note

前端开发学习──初识Html

type:disc默认 实心小圆圈;square 小方块;circle 空心小圆圈

24420
来自专栏IMWeb前端团队

css经典布局之左侧固定大小右侧自动适应

最近学习了一种经典布局,固定左侧或右侧的宽度,另一侧自适应宽度,此种布局挺常用,尤其是像后台,大部分都是采用这种结构,还比如像订餐类的APP,进入商家的时候,会...

30000

扫码关注云+社区

领取腾讯云代金券