资讯专栏INFORMATION COLUMN

CSS初体验#1

Turbo / 1091人阅读

摘要:引入内联直接在标签内写属性名属性值添加标签,通常在里,结合选择器给定属性标签添加,选择器和属性外联把多带带放在一个文件里,通过来加载这个文件,通常放在里文件地址文件中引入另一个文件,放在第一行就可以,不常用另一个地址关于列表列表横排每个添加属

引入css

内联:直接在标签内写

style="css属性名: 属性值;"

添加标签,通常在里,结合选择器给定属性


    

外联:把css多带带放在一个文件里xxx.css,通过来加载这个文件,通常放在


    

css文件中引入另一个css文件,放在第一行就可以,不常用

@import url(另一个css地址)

关于 ul 列表

ul 列表横排

/*每个li添加float属性*/
li{
    float: left;
}
/*添加浮动,会使之后的html标签上移*/
/*在父辈(ul)添加类*/

.clearfix::after{
    content: "";
    display: block;
    clear: both;
}

/*可以使元素重新归位*/

去掉项目符号

ul{
    list-style: none;
}

取消ul自带marginpadding

ul{
    margin: 0;
    padding: 0;
}

css选择器

所有元素

*{
    color: red;
}

id选择器

#xxx{
    color: red;
}

类(class)选择器

.xxx{
    color: red;
}
/*修改同时拥有 classname1 classname2 的元素下面的 xxx元素 的 css状态*/
.classname1.classname2 > XXX{
    color: red;
}

后代元素

/*xxx下面的yyy*/
xxx yyy{
    color: red;
}

强制要求子元素

/*xxx下面的yyy,且yyy必须是xxx的子元素*/
xxx > yyy{
    color: red;
} 

伪类选择器

/*该选择器选择特定序号的元素*/

/*你要选的标签*/:nth-child(xxx){
    color: red;
}

xxx:
    even 选择偶数序号
    odd  选择奇数序号
    各式各类的函数
    :nth-child(1)= :first-child

组合

id="keyboard"的元素的子元素

下的子元素被悬浮时,下的子元素

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/115846.html

相关文章

  • sass入门体验

    摘要:接上文入门初体验,接下来讲讲,有两种文件后缀名,一种是,另一种是。 接上文less入门初体验,接下来讲讲sass,sass有两种文件后缀名,一种是.sass,另一种是.scss。前者类似于ruby的语法规则,没有花括号,没有分号,具有严格的缩进;而后者更贴近于css的语法规则,易于阅读,更具语义性,所以本文采用.scss后缀名来编写sass代码 编译 1、Ruby:sass是由Rub...

    aisuhua 评论0 收藏0
  • html体验#2

    摘要:但在后端代码中容易识别成注释,慎用忘记加分号啦执行为协议,这里意思为不执行任何命令忘记加分号啦执行为协议,这里意思为不执行任何命令标签也用于跳转页面,但必须有按钮或者点击才能跳转完整样式网址同标签提交必须写属性才能被提交。 碎碎念 关于布局 css布局:横向、纵向 2019年新进展:css grid git bash 上安装 http server 目的在于不使用 file:/...

    Cobub 评论0 收藏0
  • html体验#2

    摘要:但在后端代码中容易识别成注释,慎用忘记加分号啦执行为协议,这里意思为不执行任何命令忘记加分号啦执行为协议,这里意思为不执行任何命令标签也用于跳转页面,但必须有按钮或者点击才能跳转完整样式网址同标签提交必须写属性才能被提交。 碎碎念 关于布局 css布局:横向、纵向 2019年新进展:css grid git bash 上安装 http server 目的在于不使用 file:/...

    xiangzhihong 评论0 收藏0
  • 常见的CSS预处理器之Less体验

    摘要:预处理器的技术现在已经很成熟了,而且也出现了各种不同的预处理器语言,但是呢不可能一一列出,面面俱到,这篇文章呢,主要是介绍一下比较常见的预处理器语言之一之初体验。 CSS预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为CSS增加了一些编程的特性,将CSS作为目标生成文件,然后开发者就只要使用这种语言进行编码工作。 简单来说,CSS预处理器用一种专门的编程语言,进行We...

    desdik 评论0 收藏0
  • less入门体验

    摘要:有众多的预处理器,其中比较流行的三个是,本文就一起来体验编写代码官方文档官网栗子编译成文件编译客户端浏览器通过在源代码中引入文件,用于实时对样式表文件进行编译并不推荐注意你的样式文件一定要在引入前先引入,并且需要 css有众多的预处理器,其中比较流行的三个是less、sass、stylus,本文就一起来体验less编写css代码官方文档:http://lesscss.org/官网栗子:...

    chinafgj 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<