HTML学习

最新推荐文章于 2024-06-21 01:45:00 发布

萧兮ik-L

最新推荐文章于 2024-06-21 01:45:00 发布

阅读量367

点赞数

分类专栏： html学习文章标签： html css

本文链接：https://blog.csdn.net/pslqq9/article/details/107549439

版权

第三天

HTML学习笔记

正则表达式

	####### 特殊符号
	^------>以什么开头
	$------>以什么结尾
####### 量词
*

匹配前面的子表达式任意次。例如，zo*能匹配“z”，也能匹配“zo”以及“zoo”。等价于{0,}。
+
匹配前面的子表达式一次或多次(大于等于1次）。例如，“zo+”能匹配“zo”以及“zoo”，但不能匹配“z”。+等价于{1,}。
?
匹配前面的子表达式零次或一次。例如，“do(es)?”可以匹配“do”或“does”。?等价于{0,1}。
{n}
n是一个非负整数。匹配确定的n次。例如，“o{2}”不能匹配“Bob”中的“o”，但是能匹配“food”中的两个o。
{n,}
n是一个非负整数。至少匹配n次。例如，“o{2,}”不能匹配“Bob”中的“o”，但能匹配“foooood”中的所有o。“o{1,}”等价于“o+”。“o{0,}”则等价于“o”。
{n,m}
m和n均为非负整数，其中n<=m。最少匹配n次且最多匹配m次。例如，“o{1,3}”将匹配“fooooood”中的前三个o为一组，后三个o为一组。“o{0,1}”等价于“o?”。请注意在逗号和两个数之间不能有空格。

######## 范围：
\d <=>[0-9]
[范围]---->[a-z] [A-Za-z],[13579],[1-37-9]
[^范围]===》不在范围内的 [^2-6]表示只要不是2-6内的数字都可以
|（或）x|y == [xy]
() ===>整体 1(3\d)|(8[13589])|(7[136])

iframe:内联框架

作用：把其他页面嵌入到当前页面中
iframe属性：
src:url地址【嵌入的页面地址】
frameborder：边框【0和no都表示没有；1和yes都表示有】
width:宽度
height:高度
代码示例：

<body>
		这是主页面
		<iframe src="testiframe.html" frameborder="0" scrolling="no" width="700" height="300"></iframe>
		萧兮
		<iframe src="http://www.baidu.com" frameborder="0" width="700" height="500" scrolling="no"></iframe>
	</body>

运行展示：在这里插入图片描述

css样式

1简介CSS
css是一种网页渲染技术，把文档结构和表现形式分离，使得网页更加的清爽。
css的必要条件：渲染特定的html标签。
div、span 等容器：
div===>层，块状元素，p,h1~h6…>特点：单独占一行
span=> 行内元素, a,font,img…特点：可以在一行中显示
但是：CSS学习后，没有绝对的“行内元素”与“块状元素”，
可以通过 display属性来进行转换【inline(行内)|block(块状)】

div+css布局

Css样式写在哪，怎么写？
a.标签内部的style 属性中、
b.写在 head下的Style 标签中
c.写在单独的CSS文件中
【注意：需要引入样式文件

】语法： { 样式属性：值；样式属性2：值2； }

2.常用CSS样式属性讲解

				/*尺寸*/
				width: 700px;
				height: 600px;
				/*边框*/
				/*border: 2px solid red;*/
				border-top: 2px solid red;
				border-right: 5px dashed black;
				border-bottom: double violet;
				border-left: 3px dotted green;
				/*字体*/
				/*颜色*/
				color: orange;
				/*字体大小*/
				font-size: 20px;
				/*字体加粗*/
				font-weight: bold;
				/*字体样式*/
				font-family: "黑体";
				/*字体倾斜*/
				font-style: italic;
				/*文本居中*/
				text-align: center;
				/*行高使文本垂直居中*/
				line-height: 300px;
				/*文字装饰线*/
				text-decoration: line-through;
				/*背景*/