前端基础100点

时间 2019-11-17

标签前端基础 100点繁體版

原文原文链接

一、<head>不是页面的头，而是配置；html

二、html标记用来体现“是什么”、CSS管“长成什么样”；前端

换句话说，html表达内容和结构，CSS表达样式；数组

三、<br>没有结束标记，来自break，<br>用于换行；浏览器

四、CSS中属性声明的格式是这样的：编辑器

属性名：属性值；函数

background-color:yellow;工具

background-image:url(01.jpg);字体

五、rgba（255，255，0，0.5）中的最后的0.5是一个从0~1的值，能够当作是透明度；url

六、页面中常常看到undefined，那么什么undefined呢？答：js变量若是未被赋值，那就是undefined；spa

七、文字的高度竟然就是字号的大小；

八、文字的行高是从上一行的下面到本行的下面；

九、关于图片的格式，修饰性的通常为png，其中png8由于只有256色，因此更小，内容性的通常为jpg；

十、ctrl+T自由变化可涂掉按钮文字；

十一、PS快捷键中，ctrl+z进行撤销反复，同时按下ctrl+alt+z，能够不断向前撤销；

十二、若是PS中魔棒工具使用不了，极可能是由于你的当前图层并非你操做的图层；

1三、<hr>不是人力资源，而是华丽的分割线，且<hr>和<br>同样；

1四、

<ul></ul>意思是不用数字排序的列表；
<ol></ol>意思是用数字一、二、三、4...排序的列表；
<li></li>意思是列表项的内容；

1五、

<dl></dl>字典
<dt></dt>名词
<dd></dd>解释内容

1六、“http://”叫作“协议头”；

1七、在html中，图片是一个字，因此和先后的文字会连起来；什么？在html中，<iframe>竟然也是一个字</iframe>；

1八、width属性的50%是浏览器的50%；

1九、alt的意思是说若是图片加载不出来，出现的文字；

20、原来以前的点击哪一个省出什么效果是用usemap、<map></map>、<area>实现的；

2一、

表格标记<table></table>
<tr>表格的一行
<td></td>表格一行中的格子
</tr>
<th></th>table head是单元格的头，字体与td有区分
colspan=""，指单元格跨列，横向。rowspan你懂的，单元格跨行，纵向
<thead>和</thead>是整个表头，可造成首行悬停
<tbody>和</tbody>以及<tfoot></tfoot>

2二、一旦有style=""就是CSS来了；

2三、%2，常常用于判断一个数是奇数仍是偶数，%是取模（取余数）；

2四、result++，即result=result+1；

2五、

==，用来判断是否相等；
!=，用来判断是否不相等；

2六、Javascrip中的注释是//；CSS的注释方式是：/* */；

2七、在英文中，小写字母比大写字母的排序要大，数字比字母要小，空格是最小的；

2八、Javascript里面alert不是用等于号，而是用()，如alert("hello world");

2九、除了alert，还能够用doucument.write("");

30、if的{}结束后不能加分号；

3一、全部逻辑运算符的优先级低于关系运算符；

3二、逻辑运算符里面优先级!>&&>||；

3三、

三元运算符<exp>?<v1>:<v2>能够被当作：
if(exp)
v1;
else
v2;

3四、Javascript里面数组用[]，对象用{};

3五、前端代码中常见的Object是指对象；

3六、

遍历对象中的全部属性举例：
<script>
var ob=new Object();
ob.name="hello kitty";
ob.age=30;
ob.salary=400;
for(var x in ob)
alert("ob."+x+"="+ob[x]);
</script>

3七、想看document里面的全部成员

3八、html中Javascript放的位置的讲究，放在head里面是定义函数的，放在body里面是执行动做的；

3九、

在浏览器里面的Javascript：
<p onMouseOver="alert('hello world!');">
一个段落
</p>

40、通配符选择权，*{color:blue;}

4一、简单选择器

tag{}
.className{}
#id{}
*{}
[att]{}
:link{}

4二、

CSS优先级，从高到底：
a、行内样式
b、ID选择器的数量
c、类、伪类和属性选择器
d、标签选择器和伪元素选择器

4三、font-size，2em至关于200%

4四、text-indent，一个负的极大值，已隐藏文字，经常使用于SEO；

4五、

如下实现的是当单行文字过长时末尾出现“...”
.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

4六、cursor能够定义鼠标形状，手形是pointer，{cursor:pointer}；

4七、绝大多数的元素百分比的参照物都是它的父元素；

4八、padding值缩写的规则：对面相等，后者省略；4面相等，只设一个；

4九、margin：0 auto，即水平居中；

50、border-radius设置圆角矩形，当水平半径和垂直半径均是50%时，即为正圆；

5一、overflow的值outo为有滚动条；

5二、background-position：50% 50%就是居中；等同于background-position：center center；

5三、background-position的默认位置是padding；调整须要用到background-origin；如background-origin:content-box；

5四、<span>是指行内的一段</span>

5五、

CSS类选择器
上方定义，全部的
*.important {color:red}
上方定义，某个
p.important {color:red}
下方引用：
<p class="important"></P>

5六、

CSS的ID选择器
上方定义，
#important {color:red}
下方引用：
<p id="important"></p>

5七、

属性选择器
*[title] {color:red}
全部有title属性的颜色都是red

5八、

后代选择器是空格
逗号和空格的关系，若是是逗号是都遵循，空格是后代
选择器，如
p em
若是是紧挨的用P>em

5九、移动工具选取面板的“【】自动选择”要勾选上

60、

矩形选框工具操做

添加到选区：按住Shift
从选区减去：按住Alt
与选区交叉：按住Shift+Alt

6一、巧用矩形选区工具测量一个大图片的宽度，以下图所示，按住Shift键，左右边缘各画一个矩形选区，则右侧的总宽度即为大图片的宽度：

6二、图标、logo属于修饰性的图片，通常不是用img标签，而是用background属性来实现。

6三、

如何处理有纹理的图片的隐藏文字？
矩形选框选中>使用移动工具+Alt键+shift键

6四、

切图的第一步：隐藏文字，只留背景，由于文字通常在html里面手打；

切图的第二步：选中后在图层处右键>复制图层，以下图：

6五、在扣一个不规则的小图标时，能够先用矩形选框工具选择图标区域，再用魔棒工具同时按住Alt键来去除多余部分

6六、如何切活动页？

（1）拉参考线；
（2）选择切片工具；
（3）点击“基于参考线的切片”按钮，选择切片从新命名；
（4）保存，全选切片，统一设置存储格式。

6七、png8保存的时候，杂边:无；无仿色。png8默认是索引颜色模式，要修改的时候要把颜色模式由“索引模式”改成“RGB模式”

6八、图片有半透明要求时，保存png24格式

6九、更改画布大小的方法，是在“图像”>“画布大小”中更改；如何缩小画布？裁剪（矩形选框>图像>裁剪）

70、PS中如何拆图层？先选中，再Ctrl+X剪切，而后Ctrl+V粘贴，便可

7一、

（1）Sprite拼图中注意图片必定要有空隙；

（2）把同属于一个模块的图片进行合并；

（3）把色彩相近的图片进行合并（图片质量较小）；

（4）只本页用到的图片合并；

（5）有状态的图标合并；

7二、

html全局属性有：
ID、class、style、title、

7三、html标签表：

7四、html中强调能够用strong和em，strong默认粗体，em默认斜体；

7五、div可视为其它标签的容器；

7六、<pre>标签可保留空格、换行等编辑器内格式，所见即所得；

7七、由于多个浏览器对视频支持的格式不一样，因此要在网页中插入视频，须要准备多种格式的视频文件；

7八、html中经常使用实体字符：

7九、