美文网首页
css基本知识

css基本知识

作者: 白富美也在学代码 | 来源:发表于2022-06-11 20:50 被阅读0次

认识css

css作用:给网页中的每个元素进行化妆,排版布局,让网页更精美

完全没有使用css的页面:基本就是一堆从上到下的,从左到右挨在一起的文本和图片

css的全称:Cascading Style  Sheets  层叠样式表

css版本:css1--css2--css2.1--css2.2

学习网站:https://www.w3.org/TR/CSS22          https://www.w3.org/TR/CSS22/propidx.html      https://www.w3.org/TR/CSS22/propidx.html


css的写法

属性名:属性值

css3种方式将样式应用到元素上:

1.内联(行内)样式inline  

<h1 style="font: size 10px;color: red;background-color: antiquewhite;">我是标题</h1>

2.文档样式表、内嵌样式表:结构和样式分离

<style>

        .title{

            font-size: 50px;

            color: red;

            background-color: antiquewhite;

        }

    </style>

    <h2 class="title">我是标题1</h2>

3.外部样式表

<link rel="stylesheet" href="css/style.css">

<style>

        @import url("css/style.css");

    </style>

<h2 class="title">我是标题1</h2>

样式文档里引入样式文档

/* css编码 */

@charset "utf-8";

/* 引入样式文件 */

@import url(/xx.css);


css基础选择器

按照一定的规则选择元素,并赋予样式

分类:通用选择器

           元素选择器

h1{}

div{}

           类选择器(一个元素可以有多个类,以空格进行分割。)

<style>

        h2{

            color: bisque;

        }

        .large_font{

            font-size: 60px;

        }

    </style>

    <h2 class="title large_font">我是标题1我的字体也想是60</h2>

    <p class="large_font">我是段落字体是60</p>

<!-- 类命名规范1.见名之意2.多个单词时之间怎么连接--可以用中划线large-font或者下划线large_font或者驼峰largeFont -->

           id选择器,同一个页面id名不可重复

   <style>
     #content{

            color: blue;

        }

    </style>

   <div id="content">id选择器</div>

           属性选择器

           组合选择器

           伪类/伪元素

css常见属性

全部小写

HTML和CSS编写规则

1.结构和样式的分离

2.

相关文章

  • 有了这些CSS套路,你也可以做一个漂亮的简历

    简历效果预览:简历原图预览 Resume 预备知识 HTML 基本标签 CSS 基本知识 DIV+CSS 布局知识...

  • 第6-9章CSS

    目录 第6章、开始学习CSS,为网页添加样式 第7章 CSS样式基本知识 第8章 CSS选择器 第9章CSS的继承...

  • CSS基本知识

    CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器...

  • CSS基本知识

    1,css的全称是什么? Cascading Style Sheets 层叠样式表 2,CSS有几种引入方式? l...

  • css基本知识

    1)内嵌式写法 2)常用属性 3)选择器的分类一: 基础选择器 标签选择器 类选择器a, 先定义类样式 b,然后要...

  • css基本知识

    认识css css作用:给网页中的每个元素进行化妆,排版布局,让网页更精美 完全没有使用css的页面:基本就是一堆...

  • CSS葵花宝典——基础入门

    CSS的基本知识很简单,你只要知道有哪些基本样式属性、CSS的选择器,怎么在页面应用CSS,就可以随便倒腾试试手了...

  • CSS-IFC:字体度量、line-height、vertica

    IFC:inline formatting content 基本知识点:深入理解CSS:字体度量、line-hei...

  • html和CSS基础课程(7-1 7-2 7-3 7-4)

    7章 CSS样式基本知识 这一章节主要讲解与CSS样式相关的基础知识:CSS样式的位置及相关的优先级,为后面的CS...

  • CSS position 知识

    css positon 基本知识position 指定一个元素在文档中的定位方式 top bottom right...

网友评论

      本文标题:css基本知识

      本文链接:https://www.haomeiwen.com/subject/crgimrtx.html