欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

Web-css-bootstrap_html/css_WEB-ITnose

程序员文章站 2024-04-02 23:31:34
...
1.rule

#html

  

      
    

  


css

h1{字体:  color:red;  //rgb(123,21,2)  #00ccff  font-family: Arial, Helvetica, sans-serif;  font-size:50px;位置  display:block;  //ul, li, p, h1      :inline;  //a, img  position:fixed;  //top:10px; left:30px;      :relative;  //相对父容器top: left:  float:left;    //浮动  clear:both;   //关闭浮动====  margin:22px;  border: 3px solid #cc0000;  padding: 23px;      -top right bottom left  margin:auto  //居中  margin-right:auto  //居左  margin-left: auto;  //靠右 背景  background-color:#0099cc  background-image: url('http://goo.gl/ODpi3y');}

2bootstrap框架

  2.1.grid栅格系统(12=6+6=4+4+4=4+8=2+8+2

  

    

Content 1

Content 2

Content 3

  2.2.tab标签(类似gmail)

    



  2.3Pills(展示网站不同部分,类似Google搜索结果页)



  2.4.jumbotron(展示大案例showcase,类似Google Mobile)

Find a place to stay.

Rent from people in over 34,000 cities and 192 countries.

3.Sum总结mary

在掌握了css的基本使用后,通过使用像bootstrap这种框架就可以很快的搭建好网站的基本样式框架,从而设计多好看的页面,bootstrap提供了很多的组件,可以*搭配定制

相关标签: Web-css-bootstrap