HTML5学习之旅（一）

最新推荐文章于 2024-05-20 21:21:56 发布

云水禅心べ

最新推荐文章于 2024-05-20 21:21:56 发布

阅读量101

点赞数

分类专栏： html5学习文章标签： html5

本文链接：https://blog.csdn.net/qq_44353257/article/details/116891195

版权

html5学习专栏收录该内容

1 篇文章 0 订阅

订阅专栏

html基础

博主本人物联网工程专业，最近在考虑做一个远程控制小车的项目，考虑过开发APP控制，可惜在Android Studio 配置上因为种种原因放弃APP控制，偶然间想到可以在PC端实现，故来学习一下前端页面的编写，为之后项目开发打打基础。

博客持续更新，您的关注是我更新的最大动力，欢迎交流共同进步。

HTML技术
- HTML（hyper text markup language),超文本标记语言，不是计算机编程语言，而是由一些命令组成的描述性语言
- 一般标签都是成对出现
```
<title> </title>
```
- 网页文件即采用HTML标签组织内容并符合html规范的文件，一般扩展名是.html或者.htm
- 分为
  - 静态html
  - 动态html

基础语法

标记
- 单标记
```
<br>
```
- 双标记
```
<title> 页面标记 </title>
```
注释
```

```

html文档的基本骨架

<!DOCTYPE html>			<!-- 样本代码，向浏览器指定页面使用的html版本指令，必须声明在文档第一行，在<html>标签之前-->
<html>	<!--开始标签，告知浏览器这是一个html文档，<html></html> 标签限定了文档的开头和结尾-->
    <head>		<!--定义文档的头部，是所有头部元素的容器，页面载入前就加载的内容，比如JavaScript代码，CSS样式等内容以及<meta>元信息放在其中-->
       	<title>这是页面标题</title>		<!--标识网页文件的标题-->
    </head>
    <body>				<!--主体标签，标识网页文件的主体部分，body元素包含文档的所有内容	-->
        这是页面主题，正文
    </body>
</html>

标签分类

文本和段落

<p>			<!--段落标签，标识同一段文字-->
    文字
</p>
<p align="left">		<!--align属性指代对其方式，“left,center,right”,分别为左对齐，居中对齐，右对齐-->
    段落
</p>

<br>	<!--换行-->

特殊符号

&nbsp; 空格
&lt; 小于号
&gt; 大于号
&quot;引号

文本属性

<!DOCTYPE html>
<html>
    <head>
    <title>不一样大小的文字</title>
</head>
<body>
    <p>
        <font size="2">小字体</font>	<!--字体标签属性size指定该标签包围的字体大小-->
    </p>
    <p>
        <font size="5">中等字体</font>
    </p>
    <p>
        <font size="7">大字体</font>
    </p>
</body>
</html>

给文本加标注

<acronym title="这是对标注的注解">这是有标注的内容</acronym>	<!--title属性指定注解-->

整齐的文本列表

无序列表

<ul type="disc">	<!--type属性指定显示的列表样式符号，disc为默认值，实心圆，circle为空心圆，square为实心方块-->
    <li>coffee</li>
    <li>milk</li>
    <li>tea</li>
</ul>

有序列表

<ol start="30" type="l"> <!--type属性指定显示的列表样式符号，l为默认值数字有序列表，a（A）为按小（大）写字母排列，i（I）按照小（大）写罗马字母,start属性指定起始序号，-->
    <li>coffee</li>
    <li>milk</li>
    <li>tea</li>
</ol>

定义列表

<dl>		<!--定义列表是一种缩进式的列表-->
    <dt>计算机</dt>
    <dd>用来计算的仪器</dd>
</dl>

列表允许嵌套

网页中的图像

图像
- 页面中常用的位图
  - BMP
    - 图像没有失真，保存每个像素的信息，因此文件不支持压缩并且文件较大，很少使用
  - JPEG
    - 与平台无关的文件格式，支持最高级别的压缩，压缩有损耗
  - GIF
    - GIF格式支持动画图片数据，所以GIF格式非常适合网上传输
  - png
网页中常用的Banner尺寸
- 一般在1024px*768px的情况下，页面的显示尺寸为1007px*600px

页面中的图像

<img src="1.jpg" width=800px height=600px>	
<p align="center">			<!--可以像处理文字一样处理图像-->
    <img src="1.jpg" height=800px height=600px align="bottom">	<!--img标签的align属性指定图像与文字的对齐方式-->
</p>

border属性：为图像添加边框,其值为像素值，例如

<img src="1.jpg" width=800px height=600px border=1px>

水平线

<hr width=80% size=3px color=red align=center>

改变页面背景

<!DOCTYPE html>
<html>
    <head>
        <title>改变背景</title>
    </head>
    <body background="i.jpg">
        
    </body>
        
    </body>
        
    </body>
</html>

云水禅心べ

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5学习之旅（一）

HTMLhtml基础HTML技术HTML（hyper text markup language),超文本标记语言，不是计算机编程语言，而是由一些命令组成的描述性语言一般标签都是成对出现<title> </title>网页文件即采用HTML标签组织内容并符合html规范的文件，一般扩展名是.html或者.htm分为静态html动态html基础语法标记单标记<br>双标记<title>
复制链接

扫一扫