`
san_yun
  • 浏览: 2639452 次
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

CSS总结

    博客分类:
  • HTML
 
阅读更多
1.如何让图片在div居中显示?
实现方式:
1. 让div包裹住img。
2. 利用div的自动居中 (margin: 0 auto;)

实际使用中必须为div指定高度和宽带,让大小和img一致。
另外可以通过dispaly:table来实现。

<div style="width:320px;height:260px;background-color: #FFFFFF;  border: 1px solid #CCCCCC;">
  				<div style="margin: 0 auto;display: table;border:1px solid red;">
  					<img style="max-height:240px;max-width:280px;" src="http://g1.ykimg.com/1100641F464CDB959CF107006F94B96F55BE3B-2804-8CF3-D46C-1A129930D5E6" />
  				</div>
  			</div>








2. div包裹ul问题

<style>
.did{
     float:right;	
}
did li{
      float:left;	
}
</style>
<div  style="border:1px solid red;">
  	<ul class="did" >
  		<li>1</li>
  		<li>2</li>
  		<li>3</li>	
       </ul>
</div>	


这段代码的效果是,ul不在div内部,可以为did使用display:inline-block属性。

3. div嵌套 span的问题
<div style="border:1px solid red;">
    <span style="float:right;">共分享24部视频</span>
</div>

这段代码中div里面的内容显示的时候会跑出div,如果为div指定一个height:28px那么文字过长会出现问题。这时可以用clearfix
  • 大小: 18.5 KB
  • 大小: 18.8 KB
分享到:
评论

相关推荐

    HTML+CSS总结.doc

    "HTML+CSS总结" HTML(HyperText Mark-up Language)是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。HTML 文本是由 HTML 命令组成的描述性文本,HTML 命令可以说明文字、图形、动画、声音、表格、...

    关于图片显示问题的CSS总结

    本文将基于“关于图片显示问题的CSS总结”这一主题,深入探讨CSS在处理图片显示时的关键知识点,以帮助开发者更好地理解和解决图片相关的问题。 首先,我们来看CSS中的`background-image`属性,它用于设置元素的...

    css总结文件(重要)

    这个"css总结文件(重要)"显然提供了一些关于CSS的核心概念、实用技巧和实例,对于学习和提升CSS技能非常有帮助。 首先,CSS的基础知识包括选择器、属性和值。选择器是用于指定我们要应用样式规则的HTML元素,例如`p...

    dw cs6的css总结

    dw cs6的css总结

    CSS总结.xmind

    CSS总结.xmind

    css总结

    【CSS总结】 CSS,全称Cascading Style Sheets(层叠样式表),是网页设计中的核心技术之一,用于控制网页元素的样式、布局和呈现。它与HTML或XML等标记语言结合使用,为网页添加视觉效果和结构化表现。在本篇内容...

    前端jscss总结笔记.zip

    这份"前端jscss总结笔记"涵盖了这两个主题的核心知识点,旨在帮助开发者深入理解和掌握它们。 JavaScript部分: 1. **基础语法**:包括变量声明(var、let、const)、数据类型(Number、String、Boolean、Null、...

    html和css总结文档

    ### 总结 HTML和CSS的学习是成为一名前端开发者的基石。理解基本元素和样式规则,掌握布局技巧,以及了解响应式设计和预处理器的使用,将有助于创建出专业且用户友好的网页。通过不断实践和探索,可以逐步深化对这两...

    css总结1

    在“css总结1”中,我们探讨了几种引入CSS样式的方法以及一些基本的CSS属性。 首先,让我们来看一下CSS样式的组成。一个CSS规则通常由两部分构成:选择器和声明。选择器指向你想要应用样式的HTML元素,如`h3`或`p`...

    前端css总结

    css总结很全,前端小白学习必备。后期还会发JS的。赚点积分

    CSS学习总结思维导图.xmind

    css学习总结思维导图

    达内科技内部资料一CSS总结.pptx

    高效的CSS、可维护的CSS、组件化的CSS、hack-free CSS 书写高效CSS: 1、使用外联样式替代行间样式或者内嵌样式 2、不推荐使用内嵌样式

    前端jscss总结笔记.rar

    在前端开发领域,JavaScript(简称JS)和CSS是构建网页动态效果和美观界面不可或缺的两种技术。本笔记将深入探讨这两者的核心概念、语法特点以及它们在实际开发中的应用。 一、JavaScript概述 JavaScript是一种轻量...

    liferay CSS总结

    CSS(Cascading Style Sheets)是用于控制网页元素样式的一种语言,对于自定义Liferay的主题和布局至关重要。以下是对Liferay CSS调整的一些关键点的详细说明: 1. **导航条背景色更改**:在`custom_common.css`...

    html+css基础总结(思维导图)

    HTML和CSS基础知识点总结(xmind编辑的思维导图)

    css-common:常用的css总结

    常用的css总结 CSS整块文本溢出省略方案 &lt; style &gt; .wrap { width : 200 px ; white - space : normal ; overflow : hidden ; text - overflow : ellipsis ; display : - webkit - box ; - webkit - ...

    HTML.css知识总结.md

    对于小白新手入手可借鉴,都是HTML+CSS基础 打好基础才会让代码写的轻松像云上游走,不费吹灰之力学好HTML+CSS

    CSS(盒子模型)总结.xmind

    css盒模型难点

Global site tag (gtag.js) - Google Analytics