对行内元素设置margin-top 和margin-bottom是否起作用？
不起作用。（需要注意行内元素的替换元素img、input，他们是行内元素，但是可以为其设置宽高，并且margin属性也是对其起作用的，有着类似于Inline-block的行为）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>对行内元素设置margin-top和margin-bottom是否起作用</title>
<style type="text/css">
.m-test1{margin: 100px;}
.m-test2{margin: 100px;}
.m-test3{margin: 100px;}
</style>
</head>
<body>
<div><span class="m-test1">xu</span></div>
<div><img class="m-test2" src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3240464600,3985442193&fm=27&gp=0.jpg"></div>
<div><input type="text" class="m-test3"></div>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script type="text/javascript">
</script>
</body>
</html>