Pink的前端
前端基础
无声有寒
这个作者很懒,什么都没留下…
展开
-
CSS3新特性
1.以前padding和border会撑大盒子,现在就固定是width这么大 2.图片模糊效果 filter是一个过滤器,后面还可以跟许多其他的函数。 3.父子盒子联动 4.过渡 简写:直接用all,改谁在下面一个盒子改 ...原创 2020-03-12 11:35:46 · 81 阅读 · 0 评论 -
CSS3新特性
1新增三大选择器(属性选择器,结构伪类选择器,为玄素选择器) 2.属性选择器(权重为10,与类选择器,伪类选择器相同) 3.结构伪类选择器,n从0开始 4.伪元素选择器 清楚浮动 ...原创 2020-03-11 23:01:21 · 72 阅读 · 0 评论 -
HTML5新特性
1.新增语义标签(代替div) 2.视频文件最好是mp4格式的。 一些重要属性设置 3.音频文件最好用mp3格式 4.新增input类型,验证的化要在form表单中,还有submit 5.新增表单属性 ...原创 2020-03-11 20:57:05 · 80 阅读 · 0 评论 -
常见布局技巧
1.边框紧靠变粗,用margin负值,让第二个框压上去 2.鼠标经过边框变色,因为之前压住了,所以有的边框只能显示三边 有两种解决方案 总结 3.利用浮动压不住文字 4.行内块元素的巧妙运用,给父亲设置text-align:center 里面的元素自动居中对齐 5.强化三角 把上宽拉高,只有右边保留颜色,得到一个蓝色这样的直角三角形 6.CSS...原创 2020-03-10 21:10:55 · 336 阅读 · 0 评论 -
CSS高级技巧
1.精灵图 精灵图的原理 右和下为正方向 3.字体图标 4.三角形效果 盒子宽高一定要为0,其他三边透明色 框起来的两行是为了兼容性考虑 5.鼠标样式 6.表单边框 7.防止文本域被拖大 8.图片(行内块,行内元素)与文字居中对齐 图片底册有空白缝隙的原因 9.单行溢出文字隐藏 多行文字溢出 要设置第几行显示 ...原创 2020-03-10 19:21:42 · 107 阅读 · 0 评论 -
CSS书写规范
1.代码书写要按顺序 2.例子 3.页面布局分析原创 2020-03-09 21:41:29 · 60 阅读 · 0 评论 -
元素的显示与隐藏
原创 2020-03-09 21:41:03 · 85 阅读 · 0 评论 -
定位
1.定位的意义 2.定位 =定位模式+边偏移 3.定位模式 静态定位 相对定位(限制绝对定位) 绝对定位 相对父亲,会脱标 子绝父相的定位方法 固定定位 固定定位小技巧 粘性定位(导航栏拉到最上面停止住) 定位总结 定位的层叠顺序 绝对定位盒子居中 用两种方式移动盒子达到居中目的 定位的拓展 浮动不...原创 2020-03-09 12:30:59 · 133 阅读 · 0 评论 -
浮动
1.布局模式 2.标准流 3.纵标准,横浮动 4.浮动 5.浮动三大特性 脱标特性 一行显示顶端对齐特性 行内块元素特性(宽度根据内容) 6.实际开发中的布局 7.常见网页布局 各个位置的类名注意下 8.浮动先看标准流,兄弟一浮全浮不会错! 9.清除浮动 额外标签法(不推荐) 给父标签添加overflow-hidden...原创 2020-03-07 21:28:07 · 112 阅读 · 0 评论 -
PS基本操作
1.取色原创 2020-03-06 19:56:37 · 78 阅读 · 0 评论 -
盒子模型
1.网页是由许多盒子构成的 2.组成 3.边框 样式中,实线(solid),点线(dotted),还有虚线(dashed)最常用 边框复合写法 先把整体设为蓝色,在吧上边框设为红色 table,td,th中经常合并相邻边框,使得边框变细 4.内边距(padding) 内边距复合写法(注意位置) 内边距影响盒子实际大小 比如div的内部的p自己不设...原创 2020-03-06 16:50:07 · 127 阅读 · 0 评论 -
CSS三大特性
1.层叠性(就近) 后写的绿色覆盖了先写的红色 2.继承性 写在body里面的同样作用于div 一般是文字,颜色类型的继承 行高的继承,当前字的大小×倍数 3.优先级 权重会叠加,但不会进位! 例子:其中a的权重1,hover是伪类10 ...原创 2020-03-06 10:54:42 · 69 阅读 · 0 评论 -
CSS背景
1.背景颜色,默认透明 2.背景图片,url不要忘了写 3.背景平铺 若背景颜色和图片都有,图片会压住颜色 4.图片位置,方向控制 5.背景固定(制造视差效果) 6.复合写法 7.背景色半透明 8.总结 ...原创 2020-03-05 21:58:16 · 104 阅读 · 0 评论 -
垂直居中
1.文字的行高=边框高度(行高增大,文字会被压下去) 2.调整水平位置,用缩进或者水平居中原创 2020-03-05 20:31:32 · 69 阅读 · 0 评论 -
元素显示模式
1.主要分为块元素和行内元素两大类。 2.块元素(独占一行!) 3.行内元素(a比较特殊) 4.行内块元素 5.总结 6.显示模式转换: 实际开发中,经常要转换成块元素,从而设置高度宽度 转换成行内块,从而一行可以放多个 ...原创 2020-03-05 18:09:10 · 169 阅读 · 0 评论 -
CSS复合选择器
1.复合选择器是基础选择器的组合 、 2.后代选择器(空格隔开,所有的后代) 3.子选择器(>,只选下一级的) 4.原创 2020-03-05 15:14:49 · 103 阅读 · 0 评论 -
Emmet语法(tab快速生成代码)
1.html 2.css(首字母tab) 3.自动格式化代码 ctrl+alt+L原创 2020-03-05 13:57:53 · 373 阅读 · 0 评论 -
Chrome调试
1.f12打开调试 2.使用原创 2020-03-04 22:53:24 · 115 阅读 · 0 评论 -
CSS引入方式
1.内部样式表 2.行内样式表 3.外部样式表(推荐)原创 2020-03-04 21:40:23 · 65 阅读 · 0 评论 -
css文本属性
1.文本颜色 2.文本对齐(水平) 3.装饰文本(一般给a标签去表下划线) 4.文本缩进(2em缩进2个字) 5.行间距 6.文本属性总结原创 2020-03-04 18:20:11 · 76 阅读 · 1 评论 -
字体系列
1.字体系列最好在body中定义;多个字体兼容性更好 2.字体大小(通常也在body定义) 3.字体粗细 4.文字风格(通常要把斜体变正) 5.字体的复合属性(1.要按顺序 2.size和字体必须有) 6.字体属性总结 ...原创 2020-03-04 17:30:20 · 736 阅读 · 0 评论 -
CSS基础选择器
1.CSS的作用 2.语法规范:分号区分键值对(html是空格) 3.代码风格(展开式,小写,空格) 4.选择器分类 5.标签选择器 6.类选择器 首先通过上面语法定义,使用的时候通过class属性调用 类的命名: 多类名:继承多个类的样式 7.ID选择器(只能调用一次) 8.通配符选择器(选中所有标签) 9.基础选择器...原创 2020-03-04 16:34:40 · 142 阅读 · 0 评论 -
表单
1.表达的目的:为了收集用户信息 2.表达的构成:表单域,表单控件,提示信息 3.表单域,3个属性是与服务器交互用的 4.表单元素分类 5.input元素,单标签 type的属性值 其他属性 checked打开页面默认选中 例子: <form action="xxx.php" method="get"> <!-...原创 2020-03-03 17:33:05 · 701 阅读 · 0 评论 -
HTML常用标签英文全称
<ahref="#">a 超级链接(anchor)</a> <abbrtitle="abbreviation的简写">abbr 简写的(abbreviation)</abbr> <acronymtitle="Jin Hua Tang is JHT">acronym 首字母缩略词(acronym)</acron...转载 2020-03-03 15:57:55 · 974 阅读 · 3 评论 -
列表
1.列表的作用是用来布局的! 2.分为无序列表,有序列表,自定义列表 3.无序列表 4.有序列表(理解) 5.自定义列表(重点) dl是父亲,dt是名词,几个dd是对dt的解释 6.列表总结: ...原创 2020-03-03 15:33:43 · 101 阅读 · 0 评论 -
表格
1.表格是用来展示数据的,不是用来布局的 三要素:table表格,tr行,td(table data)每行的数据, th是表头,文字加粗居中 <table border="1"> <!--boarder边界线 caption标题,th标头,tr是行,td每行几个单元--> ...原创 2020-03-03 12:05:26 · 106 阅读 · 0 评论 -
IDEA快捷键
1.重复整行: control+d 2.整行移动:control+shift+up(down)原创 2020-03-02 21:18:09 · 94 阅读 · 0 评论