A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© zfy1992 初级黑马   /  2019-10-13 12:47  /  797 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

Html和css,这2个是非常基础的知识点,但是一定要学习扎实,对后期学习js有较大的帮助。
        布局方面,拿到设计师的ps源文件或者设计稿图片,先要建好项目文件夹(js、fonts、img、upload、css),在把初始化bass.css放到css文件,再创建index.html。开始书写前,一定要先分析设计稿,确定版心,然后划分区域,从左往右去写样式,需要设置宽高的都去设置,这样可以有效防止出错,写完结构再去写结构的样式,写css和html的时候一定要注意去备注,命名也要规范,书写顺序要对,方便自己查错和后面接手的人可以清晰你的代码。下面是结合老师的讲解自己对css和html的一些看法:
        静态页布局基本上用到的大部分属性是
1.        实体化三要素:宽width ,高 height , 背景 background 。
2.        文字属性:font-size、font-weight、color、lin-height、text-align、text-decoration等
3.        盒子模型:外边距margin (注意塌陷问题,浮动,定位以及overflow:hidden等可以解决这个问题)、内边距 padding (注意有宽高要减值)
4.        浮动:2种布局方式:左中右,左右布局,工作中大部分涉及这些,注意有些情况下要清除浮动不然影响后面布局。
5.        定位:相对定位、绝对定位(需要父盒子也有定位)、固定定位。
6.        盒子显示的模式:块元素、行内块、行内,要会转化: display。要知道他们的特性。
对垂直居中和水平居中的一些看法:
水平居中:
text-align: center 只对行内元素和行内块元素及盒子里面的文字内容,给父级加可以继承给子盒子里面的内容。
Margin: 0 auto; 只能让有固定宽度的块级元素水平居中;
垂直居中:
vertical-align: middle;通常让图表或图片和文字垂直居中;还能去除图片留白问题,针对行内元素和行内块元素

line-height: 高度:只能让单行文本垂直居中;针对行内元素和行内块元素

以上是我的一些学习的经验,有不足之处希望提出来

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马