首页 > 代码库 > 前端笔试题集合

前端笔试题集合

No.1

下图绿色区域的宽度为100%,其中有三个矩形,第一个矩形的宽度是200px,第二个和第三个矩形的宽度相等。请使用CSS3中的功能实现它们的布局。
col

 

已知HTML结构是:

<div class="box"><div class="item">column 1</div><div class="item">column 2</div><div class="item">column 3</div></div>

答案:

.box{               width:100%;               background:green;               display:-moz-box; /* Firefox */               display:-webkit-box; /* Safari and Chrome */               display:box;                                                                                       -webkit-box-orient:horizontal;}.item{                -moz-box-flex:1; /* Safari 和 Chrome */                -webkit-box-flex:1; /* Safari 和 Chrome */                box-flex:1; /* Safari 和 Chrome */                height:60px;                background:red;                margin:10px 0 ;                }.item:first-child{                background:red;                width:200px;                -webkit-box-flex:0; /* Safari 和 Chrome */                margin:10px;                        }.item:last-child{                background:red;                margin:10px;                }

No.2

请用html5标准完成以下页面布局(要求完整书写整个页面的html代码,不需要写CSS)

T1C.1gFhhcXXb0Z3E6-451-391

 

答案:

<!DOCTYPE html><html><head></head><body><header>头部</header><nav>导航</nav><article>    <aside>侧边栏</aside>    <hgroup>内容区</hgroup></article><footer>尾页</footer></body></html>
View Code

 

前端笔试题集合