html介绍和CSS控制页面

Deriick、rose

于 2022-06-22 01:39:47 发布

阅读量336

点赞数 1

文章标签： html 前端

本文链接：https://blog.csdn.net/dhnnnna/article/details/125382070

版权

请结合前面的总述观看，后续内容持续开发。

注意：HTML 编码格式和解码格式要一致。

标签分类:块级元素和行内元素。
行内元素：对应标签内容仅在一行中 <span> <img> <video>
块级元素：块元素独占一行 <h1> <p>

关键标签： <div>
<video> 展示视频标签

<!DOCTYPE html> <!--html声明-->
<!--html标签-->
<!--html标签大多数是成对出现的 分为头标签和尾标签-->
<!--html根标签-->
<html>
	<head>
		<!--单标签-->
		<!--告诉浏览器，需要使用UTF-8字符集解析该文件	语义化标签-->
		<meta charset="utf-8">
		<title>优雅永不过时</title>
	</head>
	<body>
		<!--标题标签h1-h6-->
		<h1>这是一个优雅的网页！</h1>
		<h2>这是一个优雅的网页！</h2>
		<h3>这是一个优雅的网页！</h3>
		<h4>这是一个优雅的网页！</h4>
		<h5>这是一个优雅的网页！</h5>
		<h6>这是一个优雅的网页！</h6>
		<!--图片标签 图片地址src属性指定-->
		<!--本地地址-->
		<img src="F:\Mobile development\material\123.png"> </img>
		<!--网页地址-->	
		<img src="https://tse4-mm.cn.bing.net/th/id/OIP-C.Zxtf2X2EddV-g7hKyBhilAHaQB?pid=ImgDet&rs=1"> </img>

<!--行内元素不会独占一行  块元素独占一行-->
    <span>我是地球人</span>>
    <span>我是地球人</span>>

    <h1>物联网实训3班</h1>
    <h1>物联网实训3班</h1>

    <p>我才是大哥</p>
    <p>好的，你才是大哥</p>

    <!--src=图片所在位置 alt=规定在图像无法显示时的替代文本-->
    <img src="F:\Mobile development\material\123.png" alt="没看到图片">

        <!-- 设置一个高100px 宽100px 边框1px边框颜色为红色的DIV-->
    <div style="height: 100px;width: 100px; border: 1px red solid"> </div>
    <div style="height: 100px;width: 100px; border: 1px green solid"> </div>

    <!--controls 控制选项  实现视频暂停 再播放等效果 -->
    <video src="F:\Mobile development\material\video\3.mp4" controls> </video>
	</body>
</html>

1、了解CSS是什么?用来于干嘛的?
       CSS指的是层叠样式表，是一种用来表现HTML或XML等文件样式的计算机语言,是描述标记语言页面格式的标准。CSS使开发人员能够分离内容和可视元素，以实现更好的页面控制和灵活性。
       层叠:层叠指的就是样式的优先级，当产生冲突时以优先级高的为准。
       作用:用来美化咱们的网页的。
2、掌握C