Html5基础入门

最新推荐文章于 2024-09-30 23:36:44 发布

阿木木的手套

最新推荐文章于 2024-09-30 23:36:44 发布

阅读量175

点赞数

文章标签： html5

本文链接：https://blog.csdn.net/weixin_41974599/article/details/79875952

版权

一、格式

以下标题就为H5的格式，输入以下格式就会自动设置为H5的格式

<!DOCTYPE html>
	<html lang="en">
		<head>
			<meta charset="UTF-8">
			<title>Document</title>
		</head>
		<body>
			
		</body>
	</html>

二、元素

因为我也是H5的初学者，可能有些地方写的不是那么的清楚还请见谅

width：宽单位像素
height：高单位像素
float：漂浮向左left 向右right
clear：清除漂浮
margin：外边框距离例：margin-left：10px 20px 30px 40px 从顶部开始顺时针方向距离外部多少像素例：margin：0px auto 自动按百分比进行居中
border：边框 border：10px solid blue 10px：设置边框的宽度 solid：边框为实线 blue：边框的颜色 dashed：虚线 inset：三维立体效果
padding：内边框的距离
table ：表格标签 css属性：border-collapse:collapse; /*collapse属性是让表格互相连接在一起的*/
tr：行
td：列
th：标题
rowspan：向下跨行例如：<td rowspan="2"></td> 向下跨两行
colspan:向右跨列例如：<td colspan="2"></td> 向右跨两列
image：图片属性例：<image src="" alt="" title=""/> src:地址，图片地址，网址也可以 alt：图片显示失败时，显示字体 title：鼠标放上去的时候显示的字
image属性是内联还是块状的，内联是不可以设置宽高的，块状应该是一行显示一个的，然而image属性元素却是内联元素，是内联可置换元素
diaplay：block 把元素设置为块级元素
类: class
.test{} // 选中class="test"的元素
伪类: 元素的某个状态
a:link 正常的a标签状态
a:hover 选中的是鼠标经过a标签时的状态
a:visited 选中的是鼠标点击后的a标签的状态
a:active 选中的是鼠标点击瞬间的状态

伪类的4个状态不能乱写，顺序为: l v h a

<a href="./01.html">第1个网页</a>
<a href="http://www.zixue.it">学习论坛</a>
<a href="http://www.zixue.it" title="PHP学习的好地方">学习论坛</a>
<a href="http://www.baidu.com" target="_blank">百度</a>
<a href="#">测试文章1</a>
<a href="#">测试文章2</a>
target的四个属性：
_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。
_self
这个目标的值对所有没有指定目标的 <a> 标签是默认目标，它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的，除非和文档标题 <base> 标签中的 target 属性一起使用。
_parent
这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中，那么它与目标 _self 等效。
_top
这个目标使得文档载入包含这个超链接的窗口，用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
提示：这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略，因此，不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符
<header></header>:标题
<nav></nav>:导航
<footer></footer>:底部
font:20px/24px '微软雅黑','黑体'; 第一个像素代表字体大小，第二个像素代表行高，后面的则为设置的字体，如果没有微软雅黑就会用后面的黑体。
<aside></aside>:h5新加的元素，用于右侧菜单栏标题用
text-align:水平居中