9.13笔记

9.13笔记

一、无序列表(ul)

1.内部必须有子标签<li></li>

2.ul自带内外边距,还有一个<p>标签、

并集选择器body,ul,p{

                                  margin:0;

                                  padding:0;

                                }

*选择器的好处:省事,全都选中。

               坏处:太省事,一至于加大浏览器的负荷

解决方法:按需选择

list-style…这是样式属性(除去列表前的符号)

ul{

     border:1px solid red;

    list-style:none(空)/circle(空心圆)/disc(实心圆)/square(正方形)

   }

二、Ol有序列表

1.内部必须有子标签<li></li>

2.天生自带内外边距

Ol与ul不停之处在于前面的符号

有序列表改变前面的符号用tyle属性修改,在标签内。

<li  tyle=”A/a/1/I>

三、自定义列表

<dl>自定义列表 <dd>内容 <dt>小标题

列表能做什么?

做二级菜单,做导航。

备注:margin与padding的问题探讨:

margin:200px;设置一个值,说明上下左右都是200px。

margin:200px(上下) 100px(左右);

 margin:100px(上)50px(左右)100px(下)

margin:100px(上)200px(右)100px(下) 200px(左)

padding同上

实际占用空间大小

一个元素实际占用的空间为width+border*2+padding*2+margin*2

一个表情的实际高度为height+padding-top+padding-bottom+2*border

两个相邻的块级同时margin时,他们之间的外边距不会叠加,会取最大的,这种现象叫margin塌陷

有的标签会设置背景是会独占一行

有的标签会随内容的增减来改变自己的空间大小

标签据此可分为两类:块级标签(会独占一行,无论内容多少){p/h1~h6/div/ul/ol/dl/等}

                                  内敛标签(行级标签,根据内容多少占据空间大小){span/img/i/b/a/em}

二者区别

块级                                           内敛

1.块级元素会独占一行               1.内敛不会独占一行—-不可以设置行高

2.块级可以设置行高                   2.内敛元素的margin上下不起作用

二者转换

块级转行级(display:inline;)

行级转块级(display:block;)

行级块元素(display:inline-block;){可以设置行高、可以在一行、margin可以随意使用}

备注:

line-height—行高–设置字体的垂直位置

 

转载于:https://www.cnblogs.com/mo123/p/9641470.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/101429.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • Python变量命名规则

    Python变量命名规则Python变量命名规则变量名只能包含字母、数字和下划线。变量名可以字母或下划线开头,但不能以数字开头,例如,可将变量命名为message_1,但不能将其命名为1_message。变量名不能包含空格,但可使用下划线来分隔其中的单词。例如,变量名greeting_message可行,但变量名greetingmessage会引发错误。不要将Python关键字和函数名用作变量名,即不要使用P…

  • C#中使用SQLDMO的StoredProcedure对象(存储过程)创建数据表「建议收藏」

    C#中使用SQLDMO的StoredProcedure对象(存储过程)创建数据表「建议收藏」               …….               SQLDMO.StoredProcedurestrProc=newSQLDMO.StoredProcedure();               //Assignanametostoredprocedure               strProc.Name=”createCustomerT

  • 微信公众号无法抓包 提示请在微信客户端打开链接

    微信公众号无法抓包 提示请在微信客户端打开链接最近有一个需求是测试公司公众号中某个需要鉴权接口的性能。首先就是需要对该接口进行抓包,根据以前写过的一篇文章,我们可以过使用Fiddler对微信PC客户端抓包来获取接口信息。使用fiddler抓包微信公众号和小程序当我在微信PC端点击需要鉴权的公众号页面时弹出“请在微信客户端打开链接”OhMyGod!我的第一直觉是微信PC端升级所致(因为之前测试时没有出现过这个问题),check一下版本是:最新的3.5.046这个问题怎么搞?百度吧!关键词是什么呢?抱着试试看的态度搜索“…

  • c语言基础—-字符串数组

    c语言基础—-字符串数组字符串在C语言中,字符串实际上是使用 null 字符'\0'终止的一维字符数组。因此,一个以null结尾的字符串,包含了组成字符串的字符。字符定义输

  • 马云收购UC你,至于到底是谁宣战

    马云收购UC你,至于到底是谁宣战

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号