前端新人学习笔记-html/css/js基础知识点(三)_html/css_WEB-ITnose

php中文网
发布: 2016-06-24 11:20:58
原创
1008人浏览过

这断时间家里有点事,上班也有点任务,所以几天没看视频没来更新了。今天来更新一下了。

一:默认样式重置

      但凡是浏览默认的样式,都不要使用。

      body,p,h1,h2,h3,h4,h5,h6,dl,dd{margin:0; font-size:12px;/* font-family:XX; */}
      ol,ul{list-style:none;padding:0;margin:0;}
      a{text-decoration:none;}
      img{border:none;}

二:块元素和内嵌元素

立即学习前端免费学习笔记(深入)”;

      块元素的特征:

          1.默认独占一行;

          2.没有宽度时,默认撑满一排;

          3.支持所有css命令;

       内联元素的特征:

           1.同类的标签可以在同排显示;

           2.不支持宽高;

           3.内容撑开宽度;

           4.不支持上下的margin和padding;

           5.代码换行被解析;

三:块元素和内嵌元素的转换

         display:block   使内联元素具备块属性标签的特性;

         display:inline   使块元素具备内嵌元素的特性。

         display:inline-block

             特性:1.块在一行显示;

Get笔记
Get笔记

Get笔记,一款AI驱动的知识管理产品

Get笔记 125
查看详情 Get笔记

                      2.行内属性标签支持宽高;

                      3.没有宽度的时候内容撑开;

             问题:1.代码换行被解析;

                      2.ie6,7不支持块属性标签的inline-block;

四:浮动

     1.块在一排显示;

     2.内联元素也支持宽高了;

     3.默认内容撑开宽度;

     4.脱离文档流;

     5.提升层级半层

        

wo shi div

         这个时候div标签就和里面的内容位于同一层级了。




box1

box2

这个时候会出现这样的现象,这就和提升了半个层级有关。

 

 

    

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号