学习CSS布局 - max-width
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>max-width</title>
<style>
.main {
max-width: 700px;
border: 1px solid red;
margin: 0 auto;
}
</style>
</head>
<body>
<div class="main">
在这种情况下使用 max-width 替代 width 可以使浏览器更好地处理小窗口的情况。<br />
这点在移动设备上显得尤为重要,调整下浏览器窗口大小检查下吧!<br /> 顺便提下, 所有的主流浏览器包括IE7+在内都支持 max-width ,所以放心大胆的用吧。
</div>
</body>
</html>
结果:
调整浏览器的窗口,div宽高自动缩放,真是很棒啊。
原文地址: http://zh.learnlayout.com/max-width.html
学习CSS布局 - max-width的更多相关文章
- 《学习CSS布局》学习笔记
近几天做了一个小的企业展示网站.虽然页面是在模板的基础上改的,但改的多了不熟悉CSS也很麻烦.正好我看到了学习CSS布局这个网站,于是补习了一下CSS知识. CSS的显示 CSS的元素分为两类:块级元 ...
- “学习CSS布局” 笔记
学习网址:http://zh.learnlayout.com/no-layout.html 本文仅为学习笔记,内容非原创. position 默认值:static 没有添加额外属性的relative和 ...
- 学习CSS布局 - position例子
position例子 通过具体的例子可以帮助我们更好地理解“position”.下面是一个真正的页面布局. 结果: 代码如下: <!DOCTYPE html> <html lang= ...
- 学习CSS布局 - position
position 为了制作更多复杂的布局,我们需要讨论下 position 属性. 它有一大堆的值,名字还都特抽象,别提有多难记了. 让我们先一个个的过一遍,不过你最好还是把这页放到书签里. 先看下运 ...
- 学习CSS布局 - box-sizing
box-sizing 人们慢慢的意识到传统的盒子模型不直接,所以他们新增了一个叫做 box-sizing 的CSS属性. 当你设置一个元素为 box-sizing: border-box; 时,此元素 ...
- 学习CSS布局 - 盒模型
盒模型 在我们讨论宽度的时候,我们应该讲下与它相关的另外一个重点知识:盒模型. 当你设置了元素的宽度,实际展现的元素却超出你的设置: 这是因为元素的边框和内边距会撑开元素. 看下面的例子,两个相同宽度 ...
- 学习CSS布局 - dispaly属性
"display"属性 display 是CSS中最重要的用于控制布局的属性. 每个元素都有一个默认的 display 值,这与元素的类型有关. 对于大多数元素它们的默认值通常是 ...
- 学习CSS布局 - margin: auto;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 学习CSS布局 - 没有布局
如果你只想把所有内容都塞进一栏里,那么不用设置任何布局也是OK的. 然而,如果用户把浏览器窗口调整的很大,这时阅读网页会非常难受: 读完每一行之后,你的视觉焦点要从右到左移动一大段距离. 试着调整下浏 ...
随机推荐
- 网站pc端分享QQ好友,空间,微博
在开发pc端网站的过程中,涉及到邀请好友的功能,之前单纯的复制粘贴已经无法满足用户的体验.故,仿照移动端添加自动分享到QQ好友,QQ空间,QQ微博的功能. 分享到QQ好友:http://connect ...
- [VUE ERROR] Error in render: "TypeError: Cannot create property 'header' on boolean 'true'"
项目基于ElemnetUi进行的开发,在引入第三方扩展库 vue-element-extends 之后使用它的表格组件报了这个错 解决方案: 1. 删除项目中的 node_modules 2. 删除 ...
- Html5画钟表盘/指针实时跳动
1.最终效果 时钟.分钟.秒指针连续移动2.完整代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml&q ...
- Ubuntu切换root身份,命令行以中文显示
很多VPS商给的默认用户名并不是root,用以下命令处理即可: 1.修改root密码 sudo passwd root 输入密码,回车,再确认一次即可 2.更改密码后切换root身份 su root ...
- [20171211]ora-16014 11g.txt
[20171211]ora-16014 11g.txt --//上午测试了10g下备库log_archive_dest_1参数配置VALID_FOR=(ONLINE_LOGFILES,ALL_ROLE ...
- 转:SQL Server中服务器角色和数据库角色权限详解
当几个用户需要在某个特定的数据库中执行类似的动作时(这里没有相应的Windows用户组),就可以向该数据库中添加一个角色(role).数据库角色指定了可以访问相同数据库对象的一组数据库用户. 数据库角 ...
- win10怎么查看进程
1.在任务栏右击-任务管理器 2.
- 4.2Python数据处理篇之Matplotlib系列(二)---plt.scatter()散点图
目录 目录 前言 (一)散点图的基础知识 (二)相关性的举例 ==1.正相关== ==1.负相关== ==1.不相关== (三)实战项目以一股票的分析 目录 前言 散点图是用于观测数据的相关性的,有正 ...
- ELK-kibana-6.3.2部署
1. 生产实践 .每个ES上面都启动一个Kibana .Kibana都连自己的ES .前端Nginx负载均衡.ip_hash + 验证 + ACL 2. kibana部署 2.1. 软件部署 [yun ...
- January 08th, 2018 Week 02nd Monday
To be yourself in a world that is constantly trying to make you something else is the greatest accom ...