美文网首页
HTML和CSS基础

HTML和CSS基础

作者: 琼花落尽lxn | 来源:发表于2016-09-02 09:31 被阅读0次

1.ANSI指的是当前操作系统的默认编码

<meta charset="UTF-8">//通知浏览器使用UTF-8编码来解析HTML文件

3.类型选择器会作用在所有的标签上,解决的办法是采用派生选择器

  ul li{
        ....
      }

4.不显示超链接的下划线

a{    text-decoration: none;}

伪类选择器:在原有选择器的基础上添加一个限定条件,当某种情况发生时再选择此标签。

5.盒模式及浮动布局
当P标签中的内容溢出的时候,我们可以添加overflow属性

6.定位
使用position实现网页的定位,有四个值
static,relative,absolute,fixed
static 是默认值,标签会显示在正常的文档流中

相对定位:标签显示在正常的文档流中
其他元素位置不受影响
可以使用top,left,等定位属性使这个元素相对原来位置偏移

绝对定位:
默认情况下是以整个浏览器为基准
除非他有一个父元素是定位元素(position属性不是默认的static)

固定定位:
无论怎样拖拽滚动条,都不会移动

定位元素的前后位置:z-index
如果没有设置或者设置了相同的z-index属性,后出现
的标签会覆盖前面的标签

z-index属性只能用在定位元素上,
如果你不想移动一个元素,只想让他变成定位元素
使用position:relative

7.内敛框架标签:
用于在网页的任意位置签入另一个网页
常用属性
width,height,scrolling,frameboder,src,
默认情况下iframe的背景是透明的,要想兼容一些低版本的浏览器,需要设置
allowtransparency = true
src 引用的页面在body上写
style=background-color:transparent

8.块级元素特点:
总是新的一行,高度,行高以及内外边距都可以控制
宽度默认是容器的百分之百,除非设定一个固定宽度
内联元素特点:
和其他元素都在一行
高度,行高以及内外边距都不能改变
宽度就是内容的宽度,不可改变

9.引入css的代码要放在head标签之内,style以外

<link rel="stylesheet" href="main.css">

行内元素设置marging和padding,只有左右有效,上下无效

10.css引入的方式

<style type="text/css">    /*内部样式*/</style>
<!--引入样式--><link rel="stylesheet" href="main.css">
嵌入样式放到标签里面

11.颜色表示方式
颜色名
十六进制
rgb
hsl
rgba
hsla

当单个页面需要设置样式时,就应该使用内部样式表

区别:外链样式与导入样式

link标签是属于xhtml范畴,而@import则是css2.1中特有的。link标签除了可以加载CSS外,还可以做很多其它的事情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。

加载的顺序的区别,link加载的css时,是一种并行(没有尝试是否是这样)加载CSS方式,而@impor则在整个页面加载完成后才加载。

兼容性的区别,因@import``CSS2.1才特有的,所以对于不兼容CSS2.1的浏览器来说,无效。

在样式控制上(比如动态改变网页的布局时,使用javascript操作DOM)的区别,此时@import就无能为力了。

12.id选择器只能在每个HTML文档中出现一次
13.输入伪类选择器

/*表单获取焦点时的光标颜色*/input:focus{    color: red;}

相关文章

网友评论

      本文标题:HTML和CSS基础

      本文链接:https://www.haomeiwen.com/subject/afmhettx.html