美文网首页
HTML浮动(补充)

HTML浮动(补充)

作者: 浮浮子 | 来源:发表于2018-07-21 23:19 被阅读0次

今日份总结

2018.7.21

昨天写了一部分关于浮动的语句,即“使图像浮动于段落左右侧、将有标题的图片居于文本左右侧、将带边框,边界的图像浮动于段落的左右侧、使段落的首字母浮动于段落左侧”

今天补充一条。(明天写几种常用的清除方法)

创建水平菜单栏

ul为无序列表,ol为有序列表。而创建水平菜单栏时为了不显示序号就是用ul。而如果想显示序号就用ol。我们把 ul元素和li元素浮向左浮动(用昨天的方法2,float)。li 元素显示为行内元素(元素前后没有换行)。这样就可以使列表排列成一行。ul 元素的宽度是 100%,还加了颜色和边框。将块级元素li转换为行级元素。

ul

{

float:left;

width:100%;

padding:0;

margin:0;

list-style-type:none;

}

li{

float:left;

color:white;

background-color:purple;

padding:0.2em 0.6em;

border-right:1px solid white;

}

li {display:inline}

例题举例为

图片中"<a href="#">"的意思是链接到本页,你不需要它跳转,但是又需要这个形式时,需要用这条语句。

相关文章

  • HTML浮动(补充)

    今日份总结 2018.7.21 昨天写了一部分关于浮动的语句,即“使图像浮动于段落左右侧、将有标题的图片居于文本左...

  • Html>浮动

    float 使块元素在一行显示 使内嵌支持宽高 不设置宽度的时候宽度由内容撑开 元素加了浮动,会脱离文档流 ,按照...

  • 前端-第三天

    浮动 a hello 简单布局

  • HTML补充

    ♦️行内元素有哪些?块级元素有哪些? 空(void)元素有那些? 首先:CSS规范规定,每个元素都有display...

  • HTML清浮动

    在项目实现中,经常会用到float属性,但float会导致元素不再属于HTML文档流,盒子的高度也不在从元素中计算...

  • html之浮动

  • html清除浮动

    css浮动可以实现很多功能,比如多栏布局,多元素的内联排列等等,在同时也带来了一些问题,浮动后就脱离了原来的文档流...

  • CSS两边固定中间自适应布局

    1:使用浮动 html: css: 2:使用绝对定位 html: css: 3:使用flexbox方法 html:...

  • HTML—浮动介绍以及清除浮动

    总结了几篇介绍HTML中浮动以及清除浮动的文章,对浮动不是很了解的可以作为学习资料进行参考! 浅谈css中浮动和清...

  • 笔记1

    1、浮动的小技巧 HTML: CSS:

网友评论

      本文标题:HTML浮动(补充)

      本文链接:https://www.haomeiwen.com/subject/rjxkmftx.html