|
html就是超文本标记语言的简写,是最基础的网页语言。html通过标签来定义语言,代码都是由标签所组成。
使用的是http协议,http服务,target表示在新的页面上目标是怎么打开,blank表示新建页面打开
当不指明目的地址,即content="3"时,表示定时3秒刷新本页面,本页面数据有可能被改动(被JS等改动)
一般是用于把当前html页面与其他文件关联起来,即关联一些文件进来。
rel属性:表示目前文档与当前文档的关系,如例子中表示的是目标文件是样式表,即关联一个样式文件,当面页面加载和执行的时候要加载这个关联的文件
type属性:文档类型
media属性:表示目标文件在哪种设备中起作用,如例子中等于screen,则表示
在屏幕中显示1.css展示的样式,等于print,则表示
在打印机中显示1.css展示的样式,两个都有则表示两个设备都展示
1.前面介绍的都是有特殊含义的标签,比如表格之类的,
现在介绍的标签是没有特殊含义的,只是为了封装数据,便于操作,
比如div标签,也就是区域标签(div区域),div没有直接含义,只是为了封装数据,div内的数据怎么操作,由自己定义的其他语言操作,比如js
比如span标签,也是区域标签(span区域),也没有直接含义,只是为了封装数据,
和div的区别是,div区域之间有换行(封装整行区域),span区域间没有换行(封装行内区域)
p标签(有含义表示段落),也叫段落标签
p标签与p标签之间除了换行外,还会空一行。
2.标签分为两大类,(标签在页面里面,后期开发会被称为元素,因为也是对象)
这样分类方便css使用,以后布局就不用纯表格了,通过div加css,也就是把区域分好,由css做布局,每个区域块中还一般会用到table做格式化
一般的html开头都有这个,那么详细解释一下:
表示文档声明类型,后面一般是html表示的是html类型,这个类型一般和根标签名一致,所谓根标签是一个文件中通常只有一个,剩下的标签都在这个根标签里面(称为枝杈),所以称之为根标签,因此html称为根标签
表示国际规范定义的,表示大型国际组织制定的(通用性更高),还有一个cterm表示是小型组织定义的。后面紧跟的w3c就是大型国际组织,
xhtml1-strict.dtd这个文件可以在DW安装目录下查找到,这是一个对标记型文档进行约束的文件,也就是把标记需要遵从的规范形成了这样一个文件,叫做DTD(约束模式文件),比较通用。还有一类叫sgamer的更高级。一旦有这样的说明就表示当前的html符合这种规则,例如,xhtml1-strict.dtd要求必须闭合,则在dw工具里一写大于号就会自动闭合。如果想没有这个,则在DW工具新建文档时不要选这种文档类型就可以了。也就是需要被哪个文件约束就在新建的时候选择哪个。
http://www.w3.org/TR/xhtml1/DTD/ 真是个网址,但是我们不需要去上网访问它,这个称之为名称空间,表示约束文件属于这个名称空间。名称空间的作用在于即使约束文件的名字都一样都可以,因为所属空间不一致,名称空间和java,c++的命令空间类似。名称空间可以取其他名字,之所以写成域名,是因为域名唯一。
ns就是名称空间的意思,xmlns="http://www.w3.org/1999/xhtml"就表示这个html标签就所属于"http://www.w3.org/1999/xhtml"这个空间。之所以把这个标签定在空间里去,是为了避免同样的标签名在所属于的名称空间中含义不一样导致的冲突。
1.XML是可扩展标记语言
2.它和HTML的区别在于,
1).html的标签是固定的,xml的标签是可以自己定义(写)的。
2).xml的规范性更强,相当强,如标签不结束即错误。
3).xml是对数据信息的描述,html是数据显示的描述,
4).xml文件,读一个标签就可以解析成一个结构体变量(类的实例化对象),
所以它被通用化了,专门用于配置文件存在,tomcat服务器用的也是xml文件放配置参数。
XML规范可被更多应用程序解释,将成为一种通用的数据交换语言,各个服务器、框架都将XML作为配置文件。
配置文件还有一种 ini文件,保存的是"键值 对"信息。
也就是说ini文件,"键值 对" 配置信息,一般用于简单数据描述,专门做一个简单配置文件存在。
而xml文件,对相对复杂的信息描述,所以更通用,国际流行的就是xml。
单行文字的文字显示忽略号(一定的文字)
自动换行:断字;只对英文使用,以作为换行说明
空白:预包装;只对中文,强制换行
空白:nowrap; 强制不换行,都可以
text-shadow 为网页添加字体字体,通过对text-shadow属性设置相关的属性值。
X轴偏移量:指阴影居于字体水平偏移的位置。
Y轴偏移量:指阴影居于字体垂直偏移的位置。
模糊:指阴影的模糊值。
29、选择内容中显示、下拉内容右图
30、修改输入输入细节的颜色不改变的颜色
31、子元素固定宽度父元素宽度被撑开
// 父元素下的子元素是行内元素
// 若父元素下的子元素是块级元素
32、让div里的图片和文字同时上下居中
33、实现宽高等典型实例
这里是所有子元素的容器
主要是通过css旋转动画的实现:
36、文字渐变效果实现
39、实现立体字的效果
40、全屏背景图片的实现
41、实现文字描边的2种方法
使用rgba()设置颜色颜色
说明:RGBA是代表红色(红色)绿色(绿色)蓝色(蓝色)和Alpha(不知道)三个字母的缩写。
43、解决1px边框变粗的问题
Ps:出现1px变粗的原因,比如在2倍屏时1px的像素对应2个物理像素。
css自己也能够进行简单的运算,主要是实现了计算这个函数。
45、CSS实现文字模糊
一张彩色的图片实现了,移出变灰的效果。
当图片带不固定时间,想要让图片整体,一般都用background-size:cover/contain,但这个只适用于背景图。缩放的问题。使用的提前条件:图片的父级容器宽高。
填充:默认值。内容拉伸填满整个内容框,不保证保持原有的比例。
包含:边保持边长和长度中的那条长度,等比缩放,可能会留白。
封面:保持原有的空间长度。宽度和高度中长度一致,长的部分等比缩放。可能部分区域不可见。(经常)
无:保持原有的保留比例。保持同时替换内容的原始尺寸大小。
按比例缩小:保持原有尺寸大小,如果容器尺寸较大,图片内容尺寸不变,保持图片的尺寸不变,不会放大缩小;容器尺寸较小的图片内容尺寸不变,最能容纳。
方式二:父元素上设置word-spacing的有合适的值
其他方案:1将行内元素写为1行(会影响布局);2行(会影响布局)。
在使用vertical-align:middle实现垂直居中的时候,经常会发现不生效的情况。
作用环境:父元素设置line-height。需要和高度一致。将显示属性设置为表格单元,将块元素转化为单元格。
Ps:垂直对齐不可继承,必须对子元素单独设置。同时需要注意的是线高的高度基于字体大小(即字体的高度),如果文字要转行会出现异常哦。
web前端全系列资料已经打包好了!!!