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可以更 ...
随机推荐
- [手机取证] 绕过屏幕锁定启用调试模式-For Android 4.4.2
Google在Android 4.x中引入了调试信任机制,类似于iOS,在设备有屏幕密码的情况下首次连接(或未记住计算机)的情况下, 需要首先打开屏幕锁定后才可进行调试启用操作. 在Android 4 ...
- JavaScript 命名规则
来源 :http://www.codelifter.com/main/tips/tip_020.shtml The following are the rules for naming JavaScr ...
- 3、NAT
<计算机网络(第5版)>P173 P182
- 使用cnpm
官方的 npm下载速度太慢 [..................] \ normalizeTree: sill install loadCurrentTree 一直是这个问题 使用淘宝的 cpm ...
- 安装spf13-vim on Windows10
安装之前 1.系统为 windows10 Version 1607 64位 企业版 2.参考 http://www.codeweblog.com/gvim-64%E4%BD%8D-windows-7 ...
- (分享)根据IP获取地理位置(百度API)
说明: 本程序调用的百度地图接口 http://lbsyun.baidu.com/index.php?title=webapi/high-acc-ip#h. 使用C#语言+VS2015 IDE开发 效 ...
- go语言环境搭建+sublime text3(windows环境下)
感觉有点坑,整了一下午~搞定 go语言环境搭建+sublime text3(windows环境下) 1.安装sublime text3 2.安装go语言程序包 3.测试go语言是否安装成功 键 ...
- Orcle基本语句(六)
-- Created on 2017/1/5 by ADMINISTRATOR DECLARE -- Local variables here i ; v_name ) := '张晓风'; v_age ...
- Verilog $random用法
“$random函数调用时返回一个32位的随机数,它是一个带符号的整形数...”,并给出了一个例子: _________________________________________________ ...
- MongoDB快速学习笔记
一,下载. XP系统,32位的下载地址: https://www.mongodb.org/dl/win32/i386 例:win32/mongodb-win32-i386-2.0.7.ziphttp: ...