css基础不扎实
写了两周的网页,发现自己的css基础还是很差的,当时培训学习的时候就发现了,我做的页面都特别的别扭和丑吧,在班级上应该是垫底的;
原先只知道用float,不会使用定位,网页连固定定位也不会,现在发现,原来手机移动端,使用的多的是绝对定位,相反浮动也就没有那么多的。
浮动后的元素,其父级元素如果想让其内容自动撑开,就得使用清楚浮动了,具体办法就是
div:before和div:after
- content: "";
- clear: both;
- display: block;
- height: 0;
word-wrap: break-word;
position: absolute;
left: 0;
top:50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
就可以自动换行并且垂直居中。
原以为html和css很简单,原来我接触的还是皮毛,还有很多都没见过的。
css基础不扎实的更多相关文章
- css基础总结一
最近在弄一个简单管理系统的前端,所以打算将做项目的一些个人感想以及总结简单罗列下,当然,主要针对前端的基础部分以及一些常用的前端个人简单技巧总结.主要分为js部分和css部分,下面是css的基础部分总 ...
- 前端开发:css基础知识之盒模型以及浮动布局。
前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西? 为什么这个浮动没有效果? 这个问题楼主已经回答了n遍.今天则是把 ...
- CSS基础总结
CSS基础总结链接地址:http://segmentfault.com/a/1190000002773955
- CSS基础篇之了解CSS和它的基本属性
CSS是什么? CSS英文全名是Cascading Style Sheets翻译过来就是层叠样式表,它主是把网页表现与内容分离的一种样式设计语言.这种语言能优化我们编程,把东西简化和优化写法,而且不同 ...
- HTML5 -入门 (---css样式-------------(css基础与css选择器)---------------------—)
---恢复内容开始--- 一css基础入门与css选择器 CSS英文全拼:cascading style sheet 层叠样式表. 在html中使用:要在head中写style标签,所有样式放在sty ...
- css 基础---选择器
1.css基础 selector {property: value} eg: h1 {color:red; font-size:14px;} p { text-align: center; color ...
- 妙味课堂——HTML+CSS基础笔记
妙味课堂的课程讲得非常的清楚,受益匪浅.先把HTML和CSS基础课程部分视频的学习笔记记录如下: padding #PS基础 ##前端需要的PS技能 - PS技能(前端需要):切图.修图.测量 - P ...
- WEB前端开发CSS基础样式全面总结
Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...
- CSS基础教程 -- 媒体查询屏幕适配
响应式布局 Media Query 的使用方法 在上例中, 我们使用Media Queries来根据3种不同尺寸的窗口使用3种不同的样式.通过不同的媒体类型和条件定义样式表规则,媒体查询让CSS可以更 ...
随机推荐
- Linux基础之常用命令(1)
一 linux命令的格式 1.命令 [选项] [参数] ls list 显示目录下内容 ① 命令名称:ls 命令英文原意:list 命令所在路径:/bin/ls 执行权限:所有用户 功能 ...
- [DFNews] Cellebrite UFED Physical Analyzer 3.8
Cellebrite 两周前正式发布了UFED设备所附带的Physical Analyzer和Logical Analyzer软件,更新后版本为3.8 下载地址已更新至置顶资源下载页面. 主要更新如下 ...
- XE6 & IOS开发之免证书真机调试(3):生成iPA文件并安装到其它苹果设备上(有图有真相)
网上能找到的关于Delphi XE系列的移动开发的相关文章甚少,本文尽量以详细的图文内容.傻瓜式的表达来告诉你想要的答案. 原创作品,请尊重作者劳动成果,转载请注明出处!!! 1.既然我们已经在真机上 ...
- block使用小结、在arc中使用block、如何防止循环引用
引言 使用block已经有一段时间了,感觉自己了解的还行,但是几天前看到CocoaChina上一个关于block的小测试主题: [小测试]你真的知道blocks在Objective-C中是怎么工作的吗 ...
- AES加密算法实现
AES算法是一种对称加密算法,是美国国家标准技术研究所NIST旨在取代DES的21世纪的加密标准. 下文实例中,密钥采用了直接写死的方式,实际使用中可以配合RSA加密算法加密密钥,从而达到更好的安全效 ...
- Autoit 在word中绘图
没有时间整理,直接看参考网址: http://www.autoitx.com/thread-257-1-1.html
- 关于Windows 7启动后网络一直转的问题的一个解决方法
前两天给自己的X220i换了个SSD,装了个windows 7 的系统,然后自然搞了一些杀毒软件之类的,为了开发需要还装了Oracle数据库,可是,不知道从什么时候开始,系统启动后右下角那个网络图标显 ...
- tracert-命令小结
前言:今天在阅读“Web性能权威指南”这本书的时候,发现 tracert 这个命令挺有意思的,在分析网络性能瓶颈的时候也能使用的到,在此就小记一笔以备后用. 1:作用 tracert 是一 ...
- [转]解决a different object with the same identifier value was already associated with the session错误
1.a different object with the same identifier value was already associated with the session. 错误原因:在h ...
- docker理念:不可变基础设施
不可变基础设施 1.什么是Immutable Infrastructure Immutable Infrastructure,直译过来就是不可变基础设施. 它是由Chad Fowler于2013年提出 ...