最近开始学习前,总结一下。
html基本结构:
[Python] 纯文本查看 复制代码 <!DOCTYPE html>
<!--html的文档声明,声明当前html文档的版本-->
<html>
<!--根标签: html开始标签 -->
<head>
<!--html标签中的第一个子标签: head开始标签-->
<meta charset="UTF-8">
<!--单个标签meta: 主要用于当前文档设置, 这里设置的是文档的编码格式 utf-8-->
<title>Document</title> <!--title标签: 主要用于设置当前文档标题-->
</head>
<!--html标签中的第一个子标签: head结束标签-->
<body>
<!--html标签中的第二个子标签: body开始标签-->
</body>
<!--html标签中的第二个子标签: body结束标签-->
</html>
<!--根标签: html结束标签 -->
html语言中注释的写法: <!-- 注释的内容 -->
标签的分类:
标签按照显示的不同, 可以分为两类:
- 块元素 (行元素): h1----h6 p div
- 内联元素 (行内元素): a img span
CSS引入方法:
内联式:
通过标签的 style 属性, 在标签上直接写样式.
<div style="width:100px; height:100px; background:red;">
这是个div标签
</div>
嵌入式:
通过 style 标签, 在网页上创建嵌入的样式表.(放在head)
<head>
<style>
div {
width: 100px;
height: 100px;
background: red;
}
</style>
</head>
外联式:
先写一个.css文件
div {
width: 100px;
height: 100px;
background: red;
}
在html head中(不加style)
<link rel="stylesheet" href="css/样式文件名.css">
盒子的真实尺寸:
- 盒子宽度 = width + padding左右 + border左右
- 盒子高度 = height + padding上下 + border上下
|