web前端基础篇⑩

1.960栅格式布局法
屏幕分辨率为1024*768.采用接 main宽为960px的布局方式
12列式:每格60px 间距20px 3 6 3版 三格式布局(最常用)
16列式:每格40px 间距20px 3 3 6 4版 四格式布局(较常用)
容器:container_x 后面x代表数字。container_12 将页面分成12等份
2.使用bootstrap下载后生成css,js,foots三个文件夹,三个文件夹不能修改不能删,缺一不可。
min是压缩版,引入时建议引入压缩版。
所有的javascript插件都依赖于js文件夹,
<script src=.js/jquery.min.js></script>
<script src=.js/bootstrap.min.js></script>
<mate name=“viweport”>移动端页面1:1缩放,
link引入,选择min.css文件,其他都没用。
3.sass
导入:@import
注释:有两种,一是标准的/**/,另一种是//。
变量:$开头,后面跟变量名,再用:跟变量值隔开。
嵌套:一般用&表示父元素选择器。
混合(mixin):使用@mixin声明混合,可以传递参数,参数名以$符号开始,多个参数以逗号分开,也可以给参数设置默认值。声明的@mixin通过@include来调用。
继承:使用关键词@extend,后面紧跟需要继承的选择器。

时间: 2024-11-08 00:20:53

web前端基础篇⑩的相关文章

web前端基础篇⑨

1.web端.app端 目前实现响应式布局,主要用以下两种方式.CSS原生代码响应式布局 @media screen.bootstrap移动设备优先.自带框架. 兼容性 用原生代码的话 根据不同的屏幕尺寸,用@media screen引入不同的值 用bootstrap,js文件自适应,优点是不用分屏幕尺寸,只用改一些小的数据.web和app图不能相同,为了浏览速度最好使用雪碧图. APP端.CSS原生代码写 需要注意:①宽高,使用百分比的方式. ②宽的话,使用rem,不能在一套css里面使用两个

web前端基础篇⑧

1.伪类选择器 都以冒号开始.:focus 焦点的地方加样式:first-child 向元素的第一个子元素添加样式锚伪类:a:link {color:red} 未访问的链接 a:visited {color:yellow} 已访问的链接a:hover {color:green} 将鼠标放在链接上a:active {color:blue} 按住链接的时候hover必须放在link和visited后,才有效.active必须放在hover之后,才有效.2.伪元素选择器 也以冒号开始.:first-l

web前端基础篇①

html1.html5和css3在IE上都不支持2.超过1100px以上的宽度,就会出现滚动条3.<!doctype html>解析模式 分为 标准模式 混杂模式 非标准模式-针对IE6or74.标签成对出现,/表示结束5.选中内容 ctrl+/ 即可注释6.<mate charset:“UTF-8”>支持中文显示 ★ps 切图①图片格式为png1.按住shift拖动鼠标建立参考线.2.使用切片工具切出图片3.导出图片:文件-储存为web格式-预设(png-24)-选中图片-储存-

web前端基础篇⑤

1.雪碧图技术(精灵图)sprite cpmpass-合并2.兼容性:1.reset充值技术,normalize技术2.加前缀-webkit —mom -ms— -o-3.<!Doctype>解析模式4.CSS中的hack技术(不同的浏览器显示不同的页面内容)5.条件注释6.倒入包opacity-filter(0-100)png背景-导包圆角-导包,图片BFC=200m:1(无限值)IE下触发BFC环境 haslagout技术双倍margin兼容性问题IE下 3PX差距font-size 10

web前端基础篇②

1.要默认选择在radio或checkbox后加checked 2.想实现单选在radio后加上name 两个命名一样即可出现排斥 3.自动聚焦 autofocus readonly只读 4.placeholder 框里提示的文字 5.textarea 文本域或留言版 也可使用placeholder 6.select下拉列表 option列表选项 size下拉可见的数目 multiple设置多选 8.form表单 method提交方式 只有get和post两种 区别为get:会在地址栏显示输入的

web前端基础篇④

1.BFC-块级元素-块级格式化上下文布局规则:独立区域,与外部毫不相关内部box会在垂直方向,一个个放置box垂直方向距离由margin决定BFC的区域不会与float box重叠计算BFC高度时,也要计算浮动元素它是被触发(被生成)的会触发生成BFC环境的元素:根元素float属性不为noneposition为absolute或fixeddisplay为inline-block,table-cell,table-caption,flex,inline flexoverflow不为visibl

web前端基础篇③

1.video视频 audio音频 controls出现控件 loop循环 autoplay自动播放例:<video/audio src=“地址” controls=“controls” loop autoplay>2.块级元素                 行内元素  独占一行                 不独占一行  设宽高                   不能设宽高  内容不影响边框            内容影响元素大小  可嵌套块级.行内           嵌套会乱  m

web前端基础篇⑥

LESS.①是一种拓展技术,基于css.②包含变量.混合.函数.运算.③简化css代码.降低维护成本④目前用的解析器(koala) 变量(值可变)@变量名:值步骤:①建立文件夹②建html和less两个文件③启动koala④配置路径⑤输入一部分less-刷新koala⑥生成用less命名的css文件⑦在html里面引入的是css文件(不用建css文件)less里引入文件@important 可引入{less 可变的/css不可变的.变量@变量名:具体的值混合(mixins)只有3类class类/

web入侵基础篇

基本的命令....最基础的,为以后提权做准备 入侵基础篇.zip:http://pan.baidu.com/s/1dDhAHwd web入侵基础篇,布布扣,bubuko.com