css、js基础实习考核

最新推荐文章于 2022-07-23 22:22:15 发布

ctrl-cv

最新推荐文章于 2022-07-23 22:22:15 发布

阅读量170

点赞数

分类专栏：实习任务笔记文章标签： js css

本文链接：https://blog.csdn.net/weixin_43857520/article/details/109269870

版权

实习任务笔记专栏收录该内容

6 篇文章 0 订阅

订阅专栏

令老娘胆战心惊的考核终于过去了。。。。整理笔记

1、说明html中的块级元素、行内元素、行内块级元素之间的区别及其转换？

答：块级元素：能够自动换行开启新的一行，能够设置宽高，margin和padding对上下左右四个方向设置均有效。

行内元素：相邻的行内元素不换行，设置宽高无效，margin设置仅左右方向有效，上下无效，padding设置上右下左都有效。水平方向上padding-left, padding-right, margin-left, margin-right都有边距效果，但是垂直方向上padding-top, padding-bottom, margin-top, margin-bottom都不会产生边距效果。

行内块级元素：元素排列在一行，不会自动换行，可设置宽度和高度以及外边距和内边距的所有样式。

转换方式：display:inline; 转换为行内元素

display:block; 转换为块级元素

display:inline-block; 转换为行内块级元素

2、html代码片段<div id="test">Hello World!!!</div>，怎么在不同的分辨率（1366*768， 1024*768）中分别显示字体大小为18px和14px?

答：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        @media screen and (max-width: 1366px) and (min-width: 1025px) {
            #test{
                font-size: 18px;
            }
        }
        @media screen and (max-width: 1024px) and (min-width: 1px) {
            #test{
                font-size: 14px;
            }
        }
    </style>
</head>
<body>
    <div id="test">Hello World!!!</div>
</body>

</html>

3、html代码片段如下：

<div>

</div>

列举多种css设置“标题”的颜色为红色的方法。

答：div p{ color:red; } div:first-child:p{ color:red; } 或者使用id选择器或类选择器

4、css值中，display和visibility的区别

答：两者都可以实现对元素的隐藏，但visibility要占用页面空间，而display不占用

5、一个登陆界面，不管分辨率怎么变，都要是登陆页面是输入框永远保持在中间怎么设置

答：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #max{
            height: 70px;
            width: 300px;
            text-align: center;
            margin: auto;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }
       
    </style>
</head>
<body>
    <div id="max">
            用户名：<input type="text"><br>
            密&nbsp;&nbsp;&nbsp;码：<input type="password"><br>
            <button>登录</button>
    </div>
</body>
</html>

6、js动态添加dom元素，比如<div id="test"></div>需要id为test的div动态添加子div，怎么实现这一功能

答：var div = document.createElement("div");

document.getElementById("test").appendChild(div);

7、什么是数组，什么是对象（object），什么是字符串，请举例说明并写出相关的书写形式

答：var arr = new Array[1,2,3,4,5]

var Person = {name : "jay", age : 12, sex : "男"}；

var i = "341";

8、for跟foreach的区别？break与continue的区别

9、var a = [1,2,3,4] var b = "123452543542" var C = [1,2,4,6,7]，请将a转为字符串，b转为数组，截取b值得前3位的字符，合并a和C？

答：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    var a = [1,2,3,4];
    console.log(a.toString());

    var b = "1,2,3,4,5";
    console.log(b.split(","));

    var c = [1,3,5,6,8];
    console.log(c.slice(0,3));
    console.log(b.substr(0,5));

    console.log(a.concat(c));

    
</script>
</html>

10、ajax最常用的方式有哪两种，它们之间有什么区别？

答：get()、post()、ajax()、getJson()。。。。。

ctrl-cv

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css、js基础实习考核

令老娘胆战心惊的考核终于过去了。。。。整理笔记1、说明html中的块级元素、行内元素、行内块级元素之间的区别及其转换？答：块级元素：能够自动换行开启新的一行，能够设置宽高，margin和padding对上下左右四个方向设置均有效。行内元素：相邻的行内元素不换行，设置宽高无效，margin设置仅左右方向有效，上下无效，padding设置上右下左都有效。水平方向上padding-left, padding-right, margin-left, margin-right都有边距效果，但是垂直方向上p
复制链接

扫一扫