2014第16周三CSS布局再学习摘录
今天尝试写了下前端页面,费了不少时间,做出的结果仍然惨不忍睹,感觉很简单的几个页面,在现有框架多个样式混杂下就是感觉很不自在随意,晚上回来又看了些div+css方面的基础知识。
1.CSS的class和id的区别:
在CSS样式中以小写的“点”及“.”来命名如: .css5{属性:属性值;} ,而在html页面里则以class="css5" 来选择调用,命名好的CSS又叫css选择器。如: .css5{属性:属性值;} 选择器在html调用为“<div class="css5">我是class例子</div> ”
在CSS样式定义的时候 以“#”来开头命名id名称如:#css5{属性:属性值;} 这个也有点像class的定义,只是class是以小写句号“.”开头命名,而ID是以“#”开头定义。 Css里的ID用法与class用法一样,只是把class换成id。如例子:在CSS样式定义ID --- #css5{height:25px;width: 200px;} ,调用ID --- <div id="css5">我是ID例子</div>。
在命名id和class类的时候特别要注意大小写,ID和class是对大小写非常敏感的,最好以英文开头,不要用中文命名CSS类名。
2.学习CSS布局:
display
是CSS中最重要的用于控制布局的属性。每个元素都有一个默认的 display
值,这与元素的类型有关。对于大多数元素它们的默认值通常是 block
或 inline
。一个
block 元素通常被叫做块级元素。一个 inline 元素通常被叫做行内元素。
block
div
是一个标准的块级元素。一个块级元素会新开始一行并且尽可能撑满容器。其他常用的块级元素包括 p
、 form
和HTML5中的新元素: header
、 footer
、 section
等等。
inline
span
是一个标准的行内元素。一个行内元素可以在段落中 <span> 像这样 </span> 包裹一些文字而不会打乱段落的布局。 a
元素是最常用的行内元素,它可以被用作链接。
none
另一个常用的display值是 none
。一些特殊元素的默认 display
值是它,例如 script
。display:none
通常被
JavaScript 用来在不删除元素的情况下隐藏或显示元素。
它和 visibility
属性不一样。把 display
设置成 none
不会保留元素本该显示的空间,但是 visibility:
hidden;
还会保留。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。