A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

本帖最后由 厦门校区 于 2018-5-15 19:28 编辑

同学们,以下是今日任务,以案例为主,重点是CSS常用选择器和DIV的使用要求每位同学可以使用DIV+CSS独立完成注册页面的布局,然后以口语化的方式在评论区提交你的每日总结,谈谈你对今日重点知识的理解!
注意:大家不要再做全部知识内容的堆砌,围绕重点知识和重要案例谈谈理解!

  • 了解CSS的概念
  • 了解CSS的引入方式
  • 了解CSS的基本语法和常用的选择器
  • 了解CSS的盒子模型,悬浮和定位.



72 个回复

倒序浏览
林文辉 css总结
1.分清一个网页有几个大盒子,可以用画图工具之类的,把最外层的大盒子画出来
2.再细分每个盒子有几个模块,放几个盒子,嵌套div;
3.模块划分后,把内容反到对应的盒子中,就可以编写css了
4.body里面没什么太多问题,不要嵌套错就行了,如果感觉会乱就在嵌套之前注释
4.必要的话,要写个clear:both,养成一个好习惯.当然如果div的长宽设置妥当不写也行
5.如果要对标签修饰,最好是在前面加上对应的id.避免影响到其他盒子.就拿hover,after,before
这些来说,如果不在前面加上对应的id,可能其他盒子就乱套了.
6.如果要对div进行移动或者变形旋转之类的,记得要加position属性
7.有一些比较有意思的属性,如:
transform:rotate, 可以根据角度进行旋转,单位是deg
transform:translateX ,水平向右移动,单位像素
transform:translateY 水平向左移动,单位像素
transtion: all..ease..  过渡动画
box-shadow: 可以给盒子添加阴影效果
z-index:  设置元素的堆叠顺序,属性值越大,该元素层离用户越近
然后最好写的时候再写一遍-webkit-transition,因为有可能有的浏览器不兼容
8.before   after为选择器,一般给选择器加动画背景,设置动画样式
9.一个网页做得好不好,至少你在拖动页面的时候页面元素不能乱套了,
否则这个网页是失败的
10.属性很多,敲几次就熟了,其实也就那么回事了

点评

nice  发表于 2019-7-7 00:27
回复 使用道具 举报
常小天
今天主要学习了用CSS+Div制作静态页面。Div相比于之前学习的表格更加的灵活,div可单独创建,并且有一个特殊功能:浮动。使其能够在页面内灵活地移动。Css被认为是一种美化HTML的工具,即“层叠样式表”。Css是通过对Div块本身的属性,以及Div其中的元素的属性进行设定,来达到美化效果的。也就是说,Css是将各种对象的属性和属性值封装进<Style>或者一个单独的Css文件,再赋予对象的。在赋予的过程中,也就是Css引入过程中,需要通过选择器在大量编码准确找出要赋予属性的对象。选择器主要的搜索原理分三种:一是通过标签名来定位,相当于通过对象名来定位;二是在编码过程中对每个待“美化”的对象(标签)设定一个唯一的Id,通过ID来定位;三是在编码过程中对每个待“美化”的对象(标签)设定一个不唯一的类名,通过类名来定位,这一点与第二种方式相似,不同点在于ID设定时需要人为的保证其不重复,而类名则可以重复,所以类名引入具有更高的复用性。
今天学习的另一个重点:浮动。需要注意的点就是div块浮动后下面的div块会向上补位。所以为了防止div块重叠,需注意及时clear浮动。盒子模型的内边距与外边距注意区分关键字即可,而css的定位中有一点需要注意,就是区分相对移动和绝对移动。并且只有在确定了移动方式后才能进行移动,所以不要忘了position属性的设置。
回复 使用道具 举报
王刘锁
昨天学习了怎么去搭建一个页面,今天学习的是怎么让这个页面更美观!在昨天的学习中主要是利用表格和表单的功能区完成一个注册页面,结构不但复杂,有台多的嵌套而且灵活性太差,做出来的页面不仅丑而且low!今天我们就学习了怎么用DIV和CSS去美化我们的页面 让它可以功能更强大,而且节省内存 提高代码灵活性
首先DIV HTML的块标签<div></div>:默认一个div块就是一行 大小自己定 <span></span>:默认在同一行的块
最有用的CSS美化工具 相当于美颜 css就是一个存储一些表现HTML标签数据的Style的列表 CSS的强大就在它背负着标准化HTML的使命 并且着中层叠式的样式表是被大多数主流浏览器所支持认可的.
那么学习css主要就是学习它的语法,我们需要记住的是选择器和声明  
选择器{声明=(属性:属性值);声明=(属性:属性值}
选择器就是一个药引也是元素的一种特有属性,通过这个药引去选择元素 声明就是括号中的元素的其它需要定义的属性和对应的属性值:
选择器的中类我们需要记住三种
1,元素选择器
根据元素去选择 就是元素标签的标签名做选择器
2,ID选择器
就是给元素标签的id属性定义值 把这个id值当做选择器 但是格式是#id值{声明}
3,类选择器
给元素标签的class属性赋值把class值当做选择器 格式是 .class值{声明}
最重要的要记住的就是css的引入方式:一共有三种需要掌握
1,行内引入:就是在元素标签上直接使用style属性去设置css
<h1 style="color:blue;font-size:100px;">我是标题</h1>
2,页面内引入:是在HTML的头标签<head>内去使用<style>标签定义css
格式是:<style>
        h1{
                color:bule;
        font-size:50px;
        }
        </style>
3,外部引入:就是另外定义一个.css文件 然后在HTML中引入css文件 同级目录下./文件名或文件名即可 上级目录../文件名 上上级目录../../文件名
<link href="../../css/demo1.css" rel="stylesheet" type="text/css" />
还有就是css的浮动功能  利用css的float属性去挪动div
float的取值有
left向左浮动  right 向右浮动 none 默认值不浮动
还要记住清楚浮动效果 clear 取值有
left左边取消 right右面取消   both 两边都取消 none 不取消
重点就先记这么多了!
回复 使用道具 举报
本帖最后由 AsusCoder 于 2018-5-17 23:51 编辑

   
姓名:曾耀峰
   学java太累了,学完今天的课,去财务处结账出去写前端吧。贴一个标签就能马上看到效果。java代码写了一天就得出1+1=2。
总结一下今天的知识。
重点:
1.使用framest标签制作简单的网站后台管理页面
2.掌握CSS链接的三种方式
难点(纯属了解):css盒子模型,css浮动,css定位

一,使用frameset标签制作后台管理页面。
     在今天的案例中,用了frameset标签嵌套子标签frame和frameset标签来制作,以下是我理解的详细步骤。
    1.新建立一个html页面,把里面的body标签删除掉。加入frameset标签(body标签和frameset标签不能共存)。
    2.重点来了。开始切割页面。需要掌握frameset属性rows和cols,和链接属性src。rows表示横着切。cols表示竖着切。根据需求,我们要先将页面切割成上下两部分,使用rows="15%,*"这个属性。里面再套一个frame标签,属性值src设为top.html。指向写有管理员个人信息和欢迎语的页面top.html
     3.对于下面的部分,要切割成左右两部分,左边是管理员操作选项的页面,设网页为left.html,右边为显示相应操作结果所得数据的页面,设为data.html。完成上述操作要再套用<frameset cols=""15%,*>这个属性。贴一下这个核心代码比较好理解。
<html>
        <head>
                <meta charset="UTF-8">
                <title></title>
        </head>
        <frameset rows="15%,*">
                <frame src="top.html"  name="top"/>
                <frameset cols="15%,*">
                        <frame src="left.html" name="left"/>
                        <frame src="right.html" name="right"/>
                </frameset>
        </frameset>
</html>

这段代码可以背下来。

二,css的三种引用方式
1.使用所有标签共有的属性style。里面按照“属性:值;”的形式写css代码。这种方式称为行内引用
2.在head标签里面使用<style>标签,写css样式,称为页面引用
3.在head标签使用link标签,属性值src填写css页面的位置,rel填写”stylesheet”,这两个属性必须要填写,不然不能引用。这种方式使css代码和html代码分离,并且其他页面也可以使用。称为外部链接。
    到这里总结可以结束了。冲着轩哥学了也用不到,都是美工的事。

    但是还是忍不住研究了css的盒子模型还有定位类型,和float浮动机制。
     当你理解div+css布局的精髓是几个盒子模型在网页上分布时,就可以做任意网站页面的布局了。
     前面html的总结有提过标签分为块状标签(div,p,table,ul这些是块状标签)和内联标签(a,img,font这些是内联标签,)。这个意思是块状标签可以直接做成一个盒子模型,每个盒子模型在正常情况下都有个看不见的框子,每个标签不相重合。可以直接设置宽高,加边框来看出这个盒子。盒子模型还有外边距属性margin,用来设置与其他盒子的距离。内边距padding。用来设置盒子里面各个标签与盒子边缘的距离。我们在使用a标签,img标签的时候,总是发现不能给它们设置宽高,加了边框border属性也看不出来。是因为这些标签不是块级标签。要想变成块级标签,在外面套一个div标签即可。
     理解完上面的盒子模型,再学float浮动就很简单了。当第一个标签贴上float属性,left就是从当前位置,浮动到父级标签的左上角。其他后面贴上float:left的标签,会跟着浮动上来。遇到前面的盒子时候,不能重合,而是紧跟在它后面。当盒子不想有其他盒子跟着,就设置一个clear属性,这样就能独占一行,其他盒子就排在下一行。
     另外,在做div模型布局的时候,要特别注意宽高方面的设置,当几个盒子排在一起,宽高超过预先设置的宽高时,会导致盒子排列和自己想的不一样。实际开发工作中是用像素级别为单位来设置宽高,要是平时做着玩,还是建议用百分比设置宽高比较方便。
     做页面的布局。个人习惯先用盒子把各个大模块利用float布局起来。不建议用border边框显示盒子的形状,因为border的粗细会占用像素,后期也要去掉,但是你已经预先设置完了各个盒子的宽高了。去掉后的几个像素会干扰布局。推荐的做法是给各个盒子加背景颜色来显示它们。
     大模块整体搭建好以后,再往各个模块添加小模块,这样做起来就比较有规划。
     最后提一下定位。定位的属性值是position,它的值分为相对定位relative,绝对定位absolute,固定定位fixed。使用相对定位可以使盒子往原来的位置上下左右直接位移。比较适合布局时候移动。使用绝对定位,要先找对一个父级元素,给父级元素设置属性pisition:relative。这样再来使用绝对定位就能相对这个父级元素移动。
     绝对定位和相对定位的区别是。绝对定位移动以后,它原来所占的位置,会被其他元素自动占领。相对定位移动以后,原来的位置还存在。其他盒子不会去占领它。
     固定定位就是,经常我们在进入一个广告网站,不论怎么滚动,都有qq客服交谈存在。这个是用固定定位来做的。
     个人觉得,前端非常无聊。
     手机打字,有错别字请忽略
     

点评

nice  发表于 2019-7-7 00:28
回复 使用道具 举报 1 0
万冕

今天学了div和css,今天学的主要是对昨天学的html进行一个美化,但是代码更复杂了

引入方式style{}类似于工具类,里面放着许多各种的选择器,然后在选择器里写需要设置的格式,类选择器是在标签内class="名字",取名字后在里面.名字
就可以将标签内的东西改成想要的格式,id选择器和类选择器很相似,也是在标签内id="名字",然后#名字,元素选择器则是找匹配的标签来进行修改,例如div{}
就会把所有的div标签改成对应的格式.

定位:相对定位是对于自己原来的所在位置,向上下左右移动. 绝对定位是相对于整个页面,上下左右移动

盒子模型比较难理解,首先需要顶一个参照物,然后在进行对比,比如一个大正方形里面嵌着一个小正方形,然后用大正方形来作为参照物,对于小正方形来说,
A就是外边距,对于大正方形来说内间距.如下图↓↓↓↓

点评

。。。。。  发表于 2019-7-8 00:17
回复 使用道具 举报
许剑鸿
webday02总结


块标签 <div></div> 一对占用一行  <span><span> 默认在同一行

css:层叠样式表 用于美化html

引入方式(重点),语法:选择器+声明

三种引入方式:行内(直接在标签上定义),页面(<head></head>间且被<style></style>包围),css文件引入

选择器:找到标签,批量美化页面 常用选择器(id选择器(标签中定义的name属性为id),类选择器(标签中定义的class属性为类名),元素选择器)

CSS的定位:relative相对定位 absolute绝对定位


↓↓↓↓


回复 使用道具 举报
rkko 中级黑马 2018-5-15 21:52:36
8#
本帖最后由 rkko 于 2018-5-16 09:02 编辑

杜石苇
htmlDay2 总结
今天初步学习了frameset 框架结构 这个与body冲突
主要学习了div块和css相结合来美化页面
css有选择器和声明组成 ,可以在行内直接设置style 或者页面内页头设置选择器{这个由好多种可以使用  元素选择器  类选择器 ID选择器 后代 子元素等等}  或者引用外部css文件
DIV块可以循环嵌套   把整个网页当初一个大的div 然后细分下去  有多少个块切割组成 每个快又能切多少个  相比前一天学的table灵活多了
div块可以用css 设置风格 字体 颜色 列表 浮动  边框等等
注册页面中间背景div'块的逻辑是盒子逻辑 把当前背景块想象成盒子 里面放入注册表单form  表单设置边距 内边距距离外边距多少多少  或者定位 position 绝对距离 absolute 上右下左顺时针距离
总之 大概了解了css和div原理  美化还是麻烦 个人审美要设置大小多少多少 距离多少多少纠结

回复 使用道具 举报
谢洪彬:
今天学习了CSS
作用:简单来说就是美化网页
          CSS的三种引入方式:   1.行内样式   直接在元素上使用
                                         2.页面内样式  <head></head>标签中使用
                                         3.外部样式  单独定义一个.css文件,在HTML中引入
                                         注: 使用引入方式遵循就近原则
       CSS的常用选择器:找到制定元素进行设置
                                元素选择器:div{}
                                id选择器 : #id{}  Id唯一
                                类选择器: .(自定义名字)  class=””使用
       CSS的盒子模型(也就是设置边距),悬浮,定位都是比较重要的,只是目前还没有全部掌握,接下来需要进行API对应查询来慢慢掌握和了解.
回复 使用道具 举报
2902 初级黑马 2018-5-15 21:53:56
10#
张清才
frame 和body不能共存 frame 可以对区域进行 行和列的切割 比tabal更灵活
用div做网页的框架,从大化小,网页设计先分大块区域,再对每块区域惊醒嵌套div 最后达到若干个div 做好一个网页
框架成型后 对每个div进行填充内容,结合css对文本 列表 等的美化 最终完成网页的结构和美观.
重点在要熟悉了解引用css的三种方法, 1*行内(Style的属性).2*页面内(在<head>内)<style> 选择器{},3*文件引用css;
伪类--多运用于超链接,对超链接不同阶段 给予不同形式的显示
回复 使用道具 举报
汪志阳
        今天主要学习CSS和DIV重新布局网站首页,主要是之前的表格布局有缺陷,不够灵活,我们学习CSS可以运用float进行块的浮动,这是表格不具备的灵活.
CSS相当于装饰网站的骨架,首先要学习它的语法.
CSS的基本语法包括:选择器和声明(属性:属性值)
CSS的引入方式:
        行内样式:即直接在HTML元素上使用style属性设置
        <h1 style="color:red;font-size:200px ;">标题</h1>
        页面内样式:即HTML的<head>标签中使用<style>标签
               
                        h1{
                                color:blue;
                                font-size: 40px;
                        }
        外部样式:单独定一个.css的文件.在HTML中引入该CSS文件.  
<link href=(css的文件地址) rel="stylesheet" type="text/css" />
CSS的选择器:
第一种方法:        div{border:1px solid bulue;
        width:40px;
        height:45px;
                }
第二种方法:        #(id名){
        border:1px solid bulue;
                }

第三种方法:        div.(class名){
        border:2px solid yellow;
}
               
还有一些其他的选择器,后面又学习了CSS的定位和一些内边距,外边距的属性,这些方法需要眼熟,然后通过查找HTML的API文档学习.
       

点评

nice  发表于 2019-7-7 00:29
回复 使用道具 举报
李思贤:今天学了Css(可以美化Html页面)
还学习了div(块).

Css三种重要引入:
行内样式 (调用方式  行内直接调用)
页面内样式  (在title下面调用)
外部样式  (创建一个css文件在里头写,然后使用link在源文件调用)

Css三个重要选择器:
元素选择器  元素(标签){声明:(属性:属性值;) }
id选择器    设置一个id名{声明:(属性:属性值;)}  调用方式 id="设置的id名"
类选择器    设置一个类名{声明:(属性:属性值;)}  调用方式 class ="设置的类名"

Css盒子模型 可以调节距离
内边距:padding
外边距:margin
边框: border
Css使用position属性必须给relatice或者absolute,然后就可以调节位置
回复 使用道具 举报
5119 中级黑马 2018-5-15 21:54:50
13#
游荣辉
今天学了css(可以美化页面)加上div(块);
css的使用方式,为了再标签上定义属性,就有了
                                行内样式 (调用方式  行内直接调用)
                                页面内样式  (在title下面调用)
                                外部样式  (创建一个css文件在里头写,然后使用link在源文件调用)
                        这仨不管是谁想要使用前面必须加上<style>标签

css是由选择器和声明组成的,选择器是什么呢? 就是能找到标签的方式 而选择器又有好多

        选择器:
                元素选择器  元素(标签){声明:(属性:属性值;) }
                id选择器    设置一个id名{声明:(属性:属性值;)}  调用方式 id="设置的id名"
                类选择器    设置一个类名{声明:(属性:属性值;)}  调用方式 class ="设置的类名"
                     ......
还有css 的盒子模型  就是为了调节距离
                                        内边距:padding
                                        外边距:margin
                                        边框: border
还有css的定位,要使用定位要有position属性必须给他值relatice或者absolute,然后就可以调节位子了

伪类就是可以改变超链接的颜色 大小等等...
回复 使用道具 举报
林恒山
css是为了美化html的,它有3种引用方式,第一种是直接在行内书写样式,第二种是放在head标签里面,第三种通过link引用外部样式文件.3种常用选择器,id选择器,类选择器,元素选择器.盒子模型主要的属性有3个:内间距padding,外边距margin,边框border.还有css定位position,relate是相对定位,absolute是绝对定位,left和top控制离参照物左边和上边多远.
回复 使用道具 举报
李志勇
css+div:
css+div用于美化HTML;
        主要学了css的引入方法:       
                        行内样式       
                        页面样式       
                        外部样式
        选择器:       
                元素选择器   
                id选择器
                类选择器

内边距padding  外边距margin           
定位position  必须给 relative或absolute中一个值才会生效  
        两个常用属性 left top
通过今天学能更加灵活的操作页面
回复 使用道具 举报
吴俊斌
HTML的块标签 分为两种 一种是div 一个div是一行         一种是span 默认所有在一行   好像这两个标签不能嵌套
今天学了三种css的引入方式:
           第一种:在本行套用style,在里面设置就好了
           第二种:在本页面中的头标签中添加style,再用选择器去控制就好了
           第三种:在外部创建一个.css的文件,在头标签引入就好了
同样选择器也学了三种重要格式:
           第一种:元素选择器 元素类型{} 创建这类元素就可以使用了
           第二种:id选择器 #自取名字{}  在属性id=自取名字就可以了
           第三种:类选择器  .自取名{}   在属性class=自取名就好了

css样式我也不懂在说什么
css盒子模型:
        内边距:padding   边框:border    外边距:margin  如果想使用left,top,就必须设置参照物position里设置有relative相对定位
absolute 绝对定位,
css浮点
        悬浮:float  可以选择向left right使用完要清空一下用clear
       
回复 使用道具 举报
颜琳琳
  今日学了框架标签<frameset>中的rows和cols的值表每行或每列占据屏幕的多大位置,frame 标签定义了要放置在每个框架中的html页面,且不能和<body>标签共存.html的块标签中<div></div>和<span></span>区别,<div>是默认一个<div>独占一行而<span>则是默认在同一行,以及学了DIV&CSS样式,CSS是层叠样式表,用来美化页面.
CSS有三种引入的方式:1. 行内引入 2. 页面内引入 3.外部引入,这三种引入方法中比较重要的是外部引入,用的也比较多,外部引入的使用方法是先要创一个文件夹CSS用来存放css样式,然后创建css文件,之后在其他页面上的使用只需在该页面的<head>中用<link href=”css文件路径” rel=”stylesheet” type=”text/css”/> 标签进行引入即可.使用外部的引入css样式的好处是可以一个css样式供多个页面内标签的使用.
在学css样式时还学了,选择器用来找到标签在哪个页面使用到的功能,选择器分为:
1.元素选择器:  div{(属:属性值;...} 该选择器的属性写在大括号中其中border,width,height等表示边框长度之类的属性值需要用px (像素)表示,不能忽略不写,如1px不能只写1.
2.Id选择器:  #d1{属性:属性值;...}该选择器在使用时必须要先给标签设置一个id,每个标签都有id的属性.
3.类选择器: .divClass{属性:属性值;...}该选择器在标签中使用class=” 类选择器名”.
前三种选择器是选择器种比较重要的需要掌握.另外还有一些选择器需要了解即可,如1. 属性选择器<style></styke>中display:lnline让其每个div在同一行显示  2. 后代选择器 div span查找div中所有span的元素 3. 子元素选择器 div>span 查找div中第一级span元素
另外还学了 1. css的浮动,css的浮动中有float属性和clear属性,其中float属性中取值有left,right;clear属性的取值有left,right和both分别表示清除向左,向右,和两边的浮动;以及css的盒子模型,该模型主要用于设置一些边框的距离,其中属性有内边距:padding,外边距:margin和边框:border;   2. css的伪类,主要用于超链接中鼠标点击和未点击还有鼠标放上去和浏览过该页面的几种变化,使用时不懂查API就可以,不用深入了解.   3. css定位中使用position属性设置定位,其中定位属性有relative相对路径和absolute绝对路径以及另外另个属性left,top.
注意:在css定位中position属性必须要设置.

点评

发表于 2019-7-7 00:29
回复 使用道具 举报
sts 中级黑马 2018-5-15 21:56:59
18#
占楼!!!!!!
回复 使用道具 举报
叶身辉:
今天学习了css和div,
主要是为了美化HTML和方便制作
Css的引入方法有三种直接在标签上定义或者在头上用style定义或者专门制作一个css文件在外部定义
主要功能可以用id和class或者直接元素名等
Css都有自己特有的样式和HTML有些不同,但是单词都是一样的
Css的盒子模型功能设置内外边框的距离调整位置
Css的定位功能和盒子有些相似也是根据属性来定位
超链接伪类主要是为了好看变颜色
其他重要的地方还是from标签,要设置action设置路径还有method来设置post上传方法
以及使用iput type的时候对每个接收的变量都要设置name来接收,并且给变量命名.

点评

.......  发表于 2019-7-8 00:18
回复 使用道具 举报
渣.. 中级黑马 2018-5-15 21:58:19
20#
柯威龙
今天学习了css和<div>标签,css的主要作用就是用于美化html.
css
学习了他的引入方式,选择器,浮动,还有盒子 定位以及伪类.
引入方式总共有三种.有行内样式,页面样式和外部样式.外部样式的话还要
重新创建一个.css的文件然后用<link>引入.
选择器的话种类比较多.但是常用的有id选择器,类选择器和属性选择器.
选择器的话都是在html的头里面写入.id选择器还要在标签里面设置id.
还有元素选择器,后代选择器,子元素选择器.这些相对来说会用的笔记少.但还是要掌握.
css的浮动标签笔记少,容易记,就是使用float属性然后利用float属性里面的left和right来取值
还有另一个属性clear应该也是同理.
盒子的话主要掌握内边距,外边距和边框,然后用他的属性来给他设定值.
定位<position>主要分为relative相对定位,也就是拿本身的表格做参照物.
还有一个absolute绝对路径,这个路径是相对于整个屏幕来做参照物.
伪类的话应该是变点击后的颜色吧.我也不大能理解,还在研究当中.
回复 使用道具 举报
江某人:
css的引入方式:
        行内样式:<h1 style="color:red(颜色);font-size:200px(大小) ;">标题</h1> 要写多个的话不太推荐使用
        页面内样式:在HTML的<head>标签中使用<style>标签设置CSS.
在        HTML的<head>标签中使用<style>标签设置CSS.
        <style>h1{
                                color:blue;
                                font-size: 40px;
                        }
                </style>
                查到h1元素调试



        外部样式:在其他文件中使用页面内样式  单独定一个.css的文件.在HTML中引入该CSS文件.
        //引入                                  //告诉我们这是一个引入文件       
        <link href="../../css/demo1.css" rel="stylesheet" type="text/css" />
       
        元素选择器: 根据元素选择调试
        div{
        border:1px solid  blue;
        width:40px;
        height:45px;
        }

        <div>123</div>                <div>123</div>  <div>123</div>
       
                ID选择器: 根据id查找调试  id是唯一的
        #d1{
        border:2px solid red;
        }
        <div id="d1">123</div>

        类选择器:根据你设置的类型查找调试
        .divClass(自己写名称前面必须加一个点){
        border:2px solid yellow;
        }
        <div class="divClass">123</div>
       
        border:1px solid blue;  border:1px这是表格  solid blue这是颜色 没有颜色显示不出表格

        浮动<float> #d1{ float:  }
        clear 清除效果:  clear:both;
        #d1{ clear:  }
       
        background-image: url(1/cs40011.png);(背景图片)
        background-position: 30% 30%;(调整背景图片大小)
回复 使用道具 举报
凌辉:
CSS三种引入方式
1行内样式,直接在标签上定义
2 页面样式,在头标签上定义
3外部样式,引用外部css文件
选择器有6种:
元素选择器div{
}
id选择器:
在头文件定义#id
然后在标签定义id
类选择器:
在头文件定义.class
然后在标签定义class
其他的选择器有属性选择器,后代选择器,子元素选择器
Css的浮动float和clear
Css盒子模型:padding;margin;border
Css的定位:先设置属性再定位
回复 使用道具 举报
1234下一页
您需要登录后才可以回帖 登录 | 加入黑马