WEB前端学习day1-HTML

最新推荐文章于 2023-09-06 08:30:00 发布

#咸菜

最新推荐文章于 2023-09-06 08:30:00 发布

阅读量1.3k

点赞数 3

文章标签： html

本文链接：https://blog.csdn.net/qq_44850230/article/details/115017080

版权

HTML基础知识

1.HTML语法规范

<html>
	<head></head>
	<body></body>
</html>
<br/>

标签是尖括号包围的关键字。
通常是双标签，开始和结束标签，如<html>等；
也有单标签，如<br/> 也可写为<br>
(转义标签用``)

2.网页初始化

DOCTYPE:声明文档类型告诉浏览器使用哪种HTML版本来显示网页
lang：定义文档的显示语言
charset：多个字符的集合计算机能够识别和存储的文字

3.标题标签

分为6级，<h1> <h2> <h3> <h4> <h5> <h6>
由大到小，由粗到细。

4.段落标签和换行标签

<p> </p> 段落标签，段落间会产生间隙。
<br> 换行标签

5.文本格式化标签

加粗 <strong>``</strong> 或 <b>``</b>
倾斜 <i>``</i>或：<em></em>
删除线 <del>``</del> 或 <s>``</s>
下划线 <ins>``</ins> 或 <u>``</u>

6.div和span标签

div标签用来布局但一行只能放一个div
span标签用来布局一行可以放多个盒子

7.图片标签

src是必须属性！！！！

<h4>图形标签的使用：</h4>
    <img src="deku.jpg" />
    <h4> alt 替换文本 图像显示不出来的时候用文本替代：</h4>
    <img src="deku1.jpg" alt="deku的图片暂时无法显示" />
    <h4> title 提示文本 鼠标放到图片上所提示的文字：</h4>
    <img src="deku.jpg" alt="deku的图片暂时无法显示" title="你好，我是deku！" />
    <h4> width 设置图片宽度，高度随之改变：</h4>
    <img src="deku.jpg" alt="deku的图片暂时无法显示" title="你好，我是deku！" width=500/>
    <h4> width 设置图片高度，宽度随之改变：</h4>
    <img src="deku.jpg" alt="deku的图片暂时无法显示" title="你好，我是deku！" height=500/>
    <h4> border设置图片边框：</h4>
    <img src="deku.jpg" alt="deku的图片暂时无法显示" title="你好，我是deku！" width=300 border=12/>

图片路径
在这里插入图片描述

8.锚点标签

标签：<a></a>
属性：href(记得加#) id

    <a href="#before">早年经历</a><br />
    <a href="#perform">演艺经历</a><br />
    <a href="#works">主要作品</a><br />
    <h4 id="before">早年经历</h4>
    <h4 id="perform">早年经历</h4>
    <h4 id="works">早年经历</h4>

9.注释标签和特殊符号

注释语句快捷键 Ctrl+ /
空格  
小于号 <
大于号>

10.复习关键

常见的标签有哪些： h标题 strong p a img div span em
图像标签的一些属性： 1. alt当图片加载错误显示的文字
2. title当鼠标悬停显示的文字
3.src图片的来源路径

#咸菜

关注

3
点赞
踩
1

收藏

觉得还不错? 一键收藏
10
评论
WEB前端学习day1-HTML

HTML基础知识1.HTML语法规范<html> <head></head> <body></body></html><br/>标签是尖括号包围的关键字。通常是双标签，开始和结束标签，如<html>等；也有单标签，如<br/> 也可写为<br>(转义标签用``)2.网页初始化DOCTYPE:声明文档类型告诉浏览器使用哪种HTML版本来显示网页lang：定义文档
复制链接

扫一扫