Div+Css视频学习笔记_html/css_WEB-ITnose

php中文网
发布: 2016-06-24 12:31:28
原创
1457人浏览过

1.段落里面(p标签)不能嵌套div.
2.css:层叠式样式档,同一个标签可以用多个样式修饰。
3.css种类:内联式,嵌入式,外部,输入。

内联:

aaaaaaaaaaa


缺点:复用性差。

嵌入:
 
好处:可以控制整个网页的某些标签。

外部:

输入:
在css文件中或者style标签中使用@import url(demo.css);

立即学习前端免费学习笔记(深入)”;

4.样式规则选择器:
html选择器,类选择器,id选择器,关联选择器,组合选择器,伪元素选择器。

html选择器:
  p {
   font-size:50px;
   color:red;
   background-color:green;
   text-decoration:underline;
  }

类选择器:
  //only use for p label
  p.one {
   color:red;
   font-size:2cm;
   background:green;
  }
  
  //use for any label 
  .two {
   color:red;
   font-size:2cm;
   background:green;  
  }

 

叮当好记-AI音视频转图文
叮当好记-AI音视频转图文

AI音视频转录与总结,内容学习效率 x10!

叮当好记-AI音视频转图文 193
查看详情 叮当好记-AI音视频转图文

adfsdf

id选择器:
  #one {
   color:red;
   font-size:2cm;
   background:green;
  }
 

adfsdf

关联选择器:
  p em {
   color:red;
   font-size:2cm;
   background:green;   
  }

  .one .two em {
   color:red;
   font-size:2cm;
   background:green;  
  }

 


  dfdf
 

组合选择器:
  p,div,a,h1,.one,#two {
   color:red;
   font-size:2cm;
   background:green;
  }

 有其中之一使用即可

伪元素选择器:
  a:link {font-size:1cm;color:red}
  a:hover {font-size:5cm;color:green}
  a:visited{font-size:2cm;color:yellow}
  a.one:link {font-size:8cm;color:blue}
  div a.one:link{font-size:12cm;color:black}

 dfdfdfdf
 ffffff
 


  ffffff
 

5.div+css好处:表现和内容分离,缩短改版时间,减少带宽成本。
段落用p,标题用hx
表格只需要用于显示数据,不用于布局。

margin:外边距
两种方式:
   .bianju{
    margin-left:10cm;
    margin-top:40cm;
    margin-bottom:4cm;
    margin-right:40cm;
   }
   
   .bianju {
    margin: 10px 20px 30px 40px;
   }

值为auto表示自动。

内边距:
   td {
    padding-left:4cm;
    padding-right:4cm;
    padding-top:4cm;
    padding-bottom:4cm;
   }


   p {
    float:right;//靠哪边对齐,三种right,left,none
   }

   .one {
    clear:none;
    clear:left;
    clear:right;
    clear:both;
   }

可下载附件: Demo
HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号