zoukankan      html  css  js  c++  java
  • 4. H5+css3

    一. H5中新增了哪些内容?

    1. H5包含html5,css3,新增的webAPI

    2. html中新增了header,footer,main,nav等语义化标签,媒体标签,canvas画布,还有一些标签属性,如input的里面

    3. css中新增了圆角,阴影,flex布局,媒体查询,过度和动画,伪类

    4.webAPI新增了localStorage与sessionStorage,webSocket,Worker,地理位置等

    二. html语义化的好处?

    结构清晰,便于对浏览器,搜索引擎解析;利于seo;也便于网站阅读维护

    三. css 中position定位?

    static: 静态定位, 流式布局.
    relative: 相对定位,参与流式布局,可以使用top, left 等在原有位置上进行位置调整 .
    absolute: 绝对定位,脱离文档流,相对于父级元素进行定位(相对于离自己最近的, position为非static的祖先级元素进行定位).
    fixed: 固定定位,脱离文档流 ,相对于浏览器窗口定位,不随页面滚动而去改变位置
    sticky: 粘性定位,可实现动态fixed. 

    四. 动画,适用于哪些场景?

    transition: 简单的动画, 只需要在两个状态之间的动画,需要通过事件触发
    keyframAnimation: 适合需要在多个状态连续进行的动画 ,可以自动播放
    js动画: 功能最强的动画,但是效率最低

    五. 怎么隐藏页面中的某个元素?

    dispaly:none;   (隐藏不占位)

    visibility:hidden;

    opacity:0 ;

    六. 行内元素和块元素的区别?

     行元素: 由内容撑宽,在水平方向排列,设置宽高,上下边距无效

     块元素: 独占一行,可设宽高,内外边距

    行内块级元素: 在水平方向排列,可设置宽高,内外边距

    七.标准盒模型和怪异盒模型的区别?

    标准: width= width                                                      内容宽就只是内容的宽度

    怪异: width= width+padding(左右)+border(左右)        内容的宽=内容的宽度+padding(左右)+border(左右)

    拓展: 元素盒模型 :通过box-sizing设置计算方式,默认为content-box,及计算内容盒,可以设置为border-box,计算到边框盒。

    八. 单行文本溢出显示为省略号?

     text-overflow: ellipsis;

     overflow:hidden;

     white-space:nowrap;

    九. 怎么实现元素上下左右都居中?

    1)实现元素本身内容居中: text-align:center+行高

    2)实现子元素在父元素中居中 : 绝对定位+上下左右设置0+maegin:auto

    3)使用flex弹性布局  (ie8不支持)

    4)绝对定位+left ,top:50%;+transform:translate:-50%

    十. 去除浮动?

    在浮动元素的父元素上添加一个class,为这个class添加后缀.after样式,其中写conter:""; display:block; clear:both;

    十一. ::before和::after伪元素的作用?

    单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素 , ::before就是以一个子元素的存在,定义在元素主体内容之前的一个伪元素。并不存在于dom之中,只存在在页面之中

    十二.如何实现浏览器内多个标签页之间的通信?

    调用 localstorge、cookies 等本地存储方式

    十三. 你如何对网站的文件和资源进行优化?

    文件合并

    文件最小化/文件压缩

    使用CDN托管

    缓存的使用

    十四.怎么实现页面设计图???

    自己思考喽!

  • 相关阅读:
    Tomcat 服务器的安装和配置
    谈谈如何在面试中发掘程序猿的核心竞争力
    Apache2.4卡住无法访问的解决……
    如何设计一个编辑窗体的基类
    我是如何实现一个通用的验证基类的?
    我的微信头像换成国旗后的遭遇
    如何安装一个优秀的BUG管理平台——真的是手把手教学!
    DevExpress学习系列(控件篇):GridControl的基本应用
    打车软件烧钱背后的商业逻辑
    如何给你的为知笔记添加一个漂亮的导航目录
  • 原文地址:https://www.cnblogs.com/a1-top/p/14632966.html
Copyright © 2011-2022 走看看