- html是一种标记语言,由嵌套的html元素组成
- html元素,由标签和内容组成
- html标签可以拥有有自己的属性,属性总是在html元素的开始标签中规定
- 搜索引擎使用标题为您的网页的结构和内容编制索引
- 查看html源代码,只需要单击右键,然后选择“查看源文件”(IE)或“查看页面源代码(Firefox)”
- 默认情况下,html会自动地在块级元素前后添加一个额外的空行,比如段落、标题元素前后
- 当显示页面时,浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格
- html的style属性:提供了一种改变所有html元素的样式的通用方法
- 三种方式插入样式表:
- 外部样式表(当样式需要被应用到很多页面的时候,外部样式表将是理想的选择)
- 内部样式表
- 内联样式
- 优先级为:内联样式>内部样式>外联样式>浏览器缺省设置
- 当 !important 规则被应用在一个样式声明中时,该样式声明会覆盖CSS中任何其他的声明,无论它处在声明列表中的哪里
- html表单用于收集用户输入,<form>元素定义HTML表单
- 表单元素指的是不同类型(即不同的type属性)的input元素,复选框、单选按钮、提交按钮等等
- <input type="submit">定义用于向表单处理程序(form-handler)提交表单的按钮
- 表单处理程序在表单的action属性中指定
- 表单中规定被提交数据的编码(默认:url-encoded)的属性是enctype
- 在很多情况下,浏览器会对用户输入要提交给web服务器的内容进行encode,然后服务器程序会自动进行decode,得到相应的原指,在我们进行post或者get操作的时候都这样
- 在用户提交表单时,我们需要做三件事
- 通过PHP htmlspecialchars()函数处理用户输入数据,把特殊字符转化为对应的html实体
- 通过PHP trim()函数去除用户输入数据中不必要的字符(多余的空格、制表符、换行)
- 通过PHP stripslashes()函数删除用户输入数据中的反斜杠
- PHP中,函数之外声明的变量拥有 Global 作用域,只能在函数以外进行访问;函数内部声明的变量拥有 LOCAL 作用域,只能在函数内部进行访问;static变量存储的都是函数最后一次被调用时所包含的信息;常量是自动全局的,可以贯穿整个脚本使用
- 变量是存储数据的容器;对象是存储数据和有关如何处理数据的信息的数据类型
- $_SERVER这种超全局变量保存关于报头、路径和脚本位置的信息
- Js一切皆对象
- Js是用来操作dom,能增加网页的互动性,能及时响应用户的操作
- Js是在客户端执行的
- PHP值赋值给Js时,要加echo
- vue,增加了数据双向绑定
***塌陷***
- margin塌陷;子元素浮动,父元素高度塌陷
- 在标准文档流中,竖直方向的margin不叠加,以较大的为准(水平方向的margin会叠加,即水平方向没有塌陷现象)
- margin这个属性,本质上描述的是兄弟和兄弟之间的距离;最好不要用margin表达父子之间的距离(比如,父元素没有border时)。所以父子之间的距离,我们要善于使用父元素的padding,而不是子元素的margin
- 有高度的盒子,才能关的住浮动
- overflow本意是将所有溢出盒子的内容,隐藏掉。但是它还有个神奇的功能,可以清楚浮动;并且overflow:hidden,能够让margin生效
- 不管一个元素是行内元素还是块级元素,如果被设置了浮动,那浮动元素会生成一个块级框,可以设置它的width和height
- margin:0 auto;(只有标准流的盒子才能使用)是让盒子居中,不是让盒子里的文本居中
- 行内元素padding上下左右都有效,margin只有left和right产生边距效果,但是top和bottom就不行(block和inline-block都可以)
******
css相关链接:
CSS样式----浮动(图文详解) - 千古壹号 - 博客园
https://segmentfault.com/a/1190000013375700
准确理解CSS clear:left/right的含义及实际用途 « 张鑫旭-鑫空间-鑫生活
CSS之使用display:inline-block来布局 - 渊源远愿 - 博客园
真正的能理解CSS中的line-height,height与line-height_一起的远方的博客-CSDN博客_line-height
***
- 背景属性用于定义HTML元素的背景
- 颜色属性被用来设置文字的颜色
- text-align文本排列属性是用来设置文本的水平对齐方式
- background-repeat:no-repeat最大就是图片本身的大小
- background-position:后面应该有两个关键字,一个水平方向,一个垂直方向。如果只有一个关键字,另一个关键字会默认为center
- 伪类对元素进行分类是基于特征(characteristics)而不是它们的名字、属性或者内容;原则上特征是不可以从文档树上推断得到的(当设置为若干链路状态的样式,也有一些顺序规则)
行高是指文本行基线间的垂直距离(基线(base line)并不是汉字文字的下端沿,而是英文字母“x”的下端沿);上行的底线和下一行顶线之间的距离就是行距;而同一行顶线和底线之间的距离是font-size的大小
- (1)height = line-height时
(2)height>line-height时
(3)height<line-height时- 相对定位元素的定位是相对其正常位置。相对定位元素经常被用来作为绝对定位元素的容器块;Absolutely定位使元素的位置与文档流无关,因此不占据空间。Absolutely定位的元素和其他元素重叠
- clear 属性指定元素两侧不能出现浮动元素
- 在 CSS3 中包含了四种组合方式:
后代选取器(以空格分隔)
子元素选择器(以大于号分隔)
相邻兄弟选择器(以加号分隔)
普通兄弟选择器(以波浪号分隔) - 手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中(这样会破坏没有针对手机浏览器优化的网页的布局),用户可以通过平移和缩放来看网页的不同部分
box-sizing:content-box;
在宽度和高度之外绘制元素的内边距和边框box-sizing:border-box;
通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度- [class*= col-] 代表包含 col- 的类名 ,比如说 col-md-4 ,demo-col-2(这个是虚构的)等都可以匹配到
[class^=col-] 代表 以 col- 开头的类名,比如说 col-md-4
[class$=col-] 代表以 col- 结尾的类名 - 响应式是通过设置百分比实现;媒体查询是定义了多套样式的条件