12 2024 档案
摘要：6.1相对定位 position:relative; top.left.right.bottom四个方向均可以设置偏移值 相对定位的话，它仍然在标准文档流中，原来的位置会被保留。 6.2绝对定位 定位:基于xxx定位，上下左右 1.没有父级元素定位的前提下，相对于浏览器定位。 2.假设父级元素存在定
阅读全文
摘要：5.1标准文件流 块级元素:独占一行 h1 h6 p div 列表 行内元素:不独占一行 span a img strong 行内元素可以被包含在块级元素中，反之，不可以。 5.2 display display:inline 行内元素display:block 块元素display:inline-
阅读全文
摘要：1.什么是盒子模型 margin:页边距 padding:内边距 border:边框 2.边框 1.边框的粗细 2.边框的样式 3.边框的颜色 3.外边距 盒子的计算方式:你这个元素到底多大？ margin+border+padding+内容宽度
阅读全文
摘要：超链接的样式 常用的是a a:hover 字体阴影效果 负数则为反方向
阅读全文
摘要：1.为什么要美化网页 有效的传递页面信息 美化网页，页面漂亮才能吸引用户 凸显页面主题 提高用户体验 span标签:重点要突出的字,使用span标签套起来 字体样式: 文本样式: 1.颜色 2.对齐方式 3.首行缩进 4.行高 line-height=height 可以实现上下居中 5.装饰(下划线
阅读全文
摘要：2.2层次选择器 1.后代选择器:在某个元素的后面 祖爷爷-爷爷-爸爸-你 2.子选择器:只有一代 父亲-儿子 3.相邻兄弟选择器:同辈 必须是紧邻的，且是下一个 4.通用选择器:同一级中，可以不相邻，但必须在下面
阅读全文
摘要：选择器： 作用:选择页面上的某一个或者某一类元素 2.1基本选择器: 1.标签选择器:选择一类标签 2.类选择器 class:选中所有class属性一致的标签(可以跨标签) .class名称{} 3.id选择器:id全局唯一 #id名称{} 不遵循就近原则:id>class>标签
阅读全文
摘要：1.标签内部 2.head里面 3.css文件 1.链接式:html 2.导入式:CSS2.1特有 优先级:行内样式＞内部样式=外部样式(后导入的覆盖前导入的--就近原则)
阅读全文
摘要：1.Cascading Style Sheet 层叠级联样式表 CSS:表现(美化网页) 字体，颜色，边距，高度，宽度，背景图片，网页定位，网页浮动.... 2.发展史 CSS1.0 只能美化字体 CSS2.0 DIV(块)+CSS，html与css结构分离的思想，网页变得简单，利于SEO CSS2
阅读全文
摘要：html+css+javascript 结构+表现+交互 1.css是什么 2.css怎么用(快速入门) 3.css选择器(重点+难点) 4.美化网页(文字，阴影，超链接，列表，渐变... ) 5.盒子模型 6.浮动 7.定位 8.网页动画(特效效果)
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>表单验证</title></head><body> <form> <p> <!--placeholder 作为用户提示 required 非空 pattern 正则
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>表单应用</title></head><body> <form> <!--readonly 只读--> <p>名字: <input type="text" name
阅读全文
摘要：<!DOCTYPE html><html lang="en"><!--head 代表网页头部--><head> <!--meta描述性标签，它用来描述我们网站的一些信息--之所以在百度搜索到， 就是因为meta--> <!--meta一般用来做SEO--> <meta charset="UTF-8"
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>基本标签学习</title></head><body> <!--标题标签--> <h1>一级</h1> <h2>二级</h2> <h3>三级</h3> <h4>四级
阅读全文
摘要：<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/html"><head> <meta charset="UTF-8"> <title>Title</title></head><body><!--src:图片地址 相对地址 ..
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>链接标签学习</title></head><body> <!--使用name作为标记名称--> <a name="top"/>顶部</a><!--a标签 href:
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><!--块元素 无论内容多少，该元素独占一行 p.h1.h2 --> <p>11</p> <h1>11</h1>
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>列表学习</title></head><body><!-- 列表就是信息资源的一种展示形式。它可以使信息结构化和条理化，并以列表的样式显示出来，以便浏览者能更快捷地
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>表格学习</title></head><body><!-- 表格 table 行 tr 列 td border 边框线宽度(px)--> <table border
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>媒体元素学习</title></head><body><!--视频元素 video src="" 视频地址 controls 必填 autoplay 自动播放(已弃
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>页面结构分析</title></head><body><!-- header:标题头部区域的内容(用于页面或页面中的一块区域) footer:标记脚步区域的内容(用
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>iframe内联框架</title></head><body><!--iframe src="path" 引用页面地址 name="" 框架标识名 width he
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>表单语法</title></head><body><h1>注册</h1><!-- form method="" get 或 post 规定如何发送表单数据 get方
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>文本框和单选框</title></head><body><!-- <input> radio单选框 type指定元素的类型,包括:text,password,che
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>多选框和按钮</title></head><body><!-- 多选框--> <form> <p> <input type="checkbox" value="sl
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>列表框文本域和文件域</title></head><body> <form> <p>国家: <!--下拉框 <select> name option value s
阅读全文
摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>各种验证</title></head><body> <form> <!--邮箱验证--> <p> <input type="email" name="email">
阅读全文
