CSS基础学习(二) 之 width min-width max-width属性
width
1. 设置元素内容区(content area)的宽度。
2. 如果box-szing属性设置为border-box,width表示border area的宽度,如下图

min-width
1. 设置元素的最小宽度。它可以避免元素的实际width的属性值比min-witdh更小的情况。
2. 当min-width值大于width或者max-width时,min-width值会覆盖其它两个值,如下图

max-width
1. 设置了元素的最大宽度。防止元素的实际宽度大于max-width
2. width大于max-width时,max-width会覆盖width

3. 当浏览器窗口宽度小于width时,浏览器会显示一个水平的滚动条来容纳页面,此时设置max-width可以阻止这种现象发生。
CSS基础学习(二) 之 width min-width max-width属性的更多相关文章
- 前端学习之路CSS基础学习二
CSS属性相关 样式操作: (1)width:为元素设置宽度 (2)height:为元素设置高度 ps:块儿级标签才能设置长宽行内标签设置长宽没有任何影响 p{ width: 30px; height ...
- CSS基础学习(一) 之 line-height 与 height 属性区别
官方定义: height:定义了了元素的高度.默认情况下,该属性订了 content area(内容区域) 的高度.如果box-sizing属性设置为 border-box,那么height就表示bo ...
- HTML&CSS基础学习笔记—创建列表
创建一张表格 很多时候我们需要在网页上展示一些数据,使用表格可以很好的来展示数据. 在HTML中<table>标签定义 表格. <table> </table> 添 ...
- Python入门基础学习 二
Python入门基础学习 二 猜数字小游戏进阶版 修改建议: 猜错的时候程序可以给出提示,告诉用户猜测的数字偏大还是偏小: 没运行一次程序只能猜测一次,应该提供多次机会给用户猜测: 每次运行程序,答案 ...
- Python基础学习二
Python基础学习二 1.编码 utf-8编码:自动将英文保存为1个字符,中文3个字符.ASCll编码被囊括在内. unicode:将所有字符保存为2给字符,容纳了世界上所有的编码. 2.字符串内置 ...
- Go基础学习(二)
数组[array] 数组定义[定义后长度不可变] 12 symbol := [...]string{USD: "$", EUR: "€", GBP: " ...
- jQuery基础学习(二)—jQuery选择器
一.jQuery基本选择器 1.CSS选择器 在学习jQuery选择器之前,先介绍一下之前学过的CSS选择器. 选择器 语法 描述 示例 标签选择器 E { ...
- CSS基础学习 21.CSS居中总结
注意:*在IE中并不代表通配符的意思,是代表根元素的意思,所以为了匹配适应各种浏览器,进行页面初始化 <style> *{ margin:0; padding:0; } </styl ...
- Django基础学习二
今天继续学习django的基础 学习用户提交url如何获得返回值 1.首先需要在工程的urls文件定义指定的urls要路由给哪个函数 在这个例子中,我们定义home的urls路由给views里的tes ...
- 两天学会css基础(二)
接上一篇博客,还有css中的两个重要知识点没有说到,就是元素的浮动与定位. 第三部分:元素的浮动与清除 这部分的内容之前的博客已总结过.请查看css中的浮动与三种清除浮动的方法这篇文章. 浮动在网页中 ...
随机推荐
- date格式互转
+"%Y/%m/%d-%H:%M:%S" date -d "2017/11/21 17:02:09" +%s
- centOs6.5配置启动ssh
.非root用户则执行su或su - 或su root或su - root切换为root用户 2.查看SSH是否安装(检查是否装了SSH包) 输入命令:rpm -qa | grep ssh 注:若没安 ...
- linux_vim_emmet插件的安装配置
首先要去如下网址下载一个安装包(英文基础好的同学可以去github上搜他的开源,写的更加详细) https://www.vim.org/scripts/script.php?script_id=298 ...
- 团队作业记账本开发NABCD
N(Need)需求 现如今大学生的消费存在很大问题,很多情况下都是图一时之快,冲动消费,但是其实这些东西并不是特别需要.这样慢慢的堆积也就导致了大学生月月精光的局面.另外,现在基本上人手一部手机,许多 ...
- SQL[Err] ORA-00979: not a GROUP BY expression
Oracle中group by用法 not a GROUP BY expression异常产生是因为group by用法的问题. 在使用group by 时,有一个规则需要遵守,即出现在select列 ...
- filter过滤器实现验证跳转_返回验证结果
1. 需求背景 需要对某个请求url进行拦截,模拟是否可以进入某一个接口,如果拦截需要返回数据false,别问我为何不用intercept拦截器. 2. web.xml <filter> ...
- 011-MAC 设置环境变量path的几种方法
一.概述 首先要知道你使用的Mac OS X是什么样的Shell,使用命令 echo $SHELL 如果输出的是:csh或者是tcsh,那么你用的就是C Shell. 如果输出的是:bash,sh,z ...
- java框架之SpringMVC(1)-入门&整合MyBatis
前言 SpringMVC简介 SpringMVC 是一个类似于 Struts2 表现层的框架,属于 SpringFramework 的后续产品. 学习SpringMVC的原因 SpringMVC 与 ...
- ORA-01555错误
有这样一种情况 0:00 我们开始查询,查询的数据是100万条 0:01 一个session update了第100万条数据 0:01 update提交了,完成 1:00 我们的查询还在继续,只读到了 ...
- [LeetCode] 系统刷题4_Binary Tree & Divide and Conquer
参考[LeetCode] questions conlusion_InOrder, PreOrder, PostOrder traversal 可以对binary tree进行遍历. 此处说明Divi ...