Head FIRST HTML & CSS 16/03/17

 最后更新时间 2016-03-18 19:11:51


css基本:

font-famliy

font-size

font-style

text-decoration

color

background-color

line-height

盒型

...


技巧:

在body选择器内先定义父类元素,给子类继承,便于管理

font-famliy后的选项其实是一个待选的优先列表

font-size 在body内最好先定义small,medium,large...子类通过200%,1.2em改变

font-style控制斜体,和<em>本质不同 italic

text-decoration 文本样式 underline

color,background-color通过rgb控制颜色 (0~255)

 通过<link>满足不同设备的用户体验


@font-face{
 font-family:"EdsonLin Font";
 src:url("font/AlexBrush-Regular.ttf");
}

css内置格式

若字体pc未安装,可以通过webfont进行操作,自定义font

置顶操作


 盒型:内距:(25px)

padding

边框

border-color

border-width

border-style

外距:(30px)

margin

背景

background-image: url(../jpg); 没有引号

background-repeat: no-repeat;

background-position: top left;


 根据需要为html增加过个<link>标记,涵盖所有的设备

<link href="../.css" rel="stylesheet" media="screen and (max-device-width : 480px");

屏幕显示  screen

打印  print

了解设备的像素  max-device-width  最大为 min-device-width 最小为

设置不同浏览器像素  max-width  min-width

css的内置媒体格式

代码样例

@media screen and (min-device-481px){

  #guarantee{

    margin-right: 250px;

  }

}

@media screen and (max-device-481px){

  #guarantee{

    margin-right: 30px;

  }

}


在一个谎言的国度,沉默就是英雄
原文地址:https://www.cnblogs.com/EdsonLin/p/5290100.html