HTML 之 CSS基础 (理解什么是css以及css怎样工作)

我对css的认识很浅,依代码加深记忆!

css样式分三种:

1: 元素内嵌样式表

2:文档内嵌样式表

3:使用外部样式表

我已在下面画出

http://www.w3school.com.cn/tiy/t.asp?f=html_a      自己看一看

注意,那个外部指向的"css基础.css"在本地。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>理解啥是css</title

    <link rel="stylesheet" type="text/css"  href="css基础.html">    <!--这就是个把外部的css引进来的link,但是这个东西优先级低,没有显现。-->

    <style type="text/css">
        a{
            font-size:80px;
            color: #59ed45;
        }
    </style>

</head>
<body>

    <a> 我将被,文档内嵌样式表控制,就是在,head里面控制我!</a> <br><br><br><br>

   <a style="font-size: 30px; color: #ff335f;"  >我是被元素内嵌样式表控制的,层叠样式表=Cascading Style Sheets,我优先级最高!!</a>    <!-- 元素内嵌样式表-->
</body>
</html>

原文地址:https://www.cnblogs.com/3532gll/p/9463637.html

时间: 2024-10-13 06:51:46

HTML 之 CSS基础 (理解什么是css以及css怎样工作)的相关文章

CSS深入理解之absolute(HTML/CSS)

absolute和float是同父异母的兄弟,因为它们具有相同点:包裹性与破坏性 absolute的特点 1.独立的,并且可以摆脱overflow的限制,无论是滚动还是隐藏: 2.无依赖,不受relative限制的,行为表现上是不使用top/right/bottom/left任何一个属性或使用auto作为值: 3.脱离文档流: 4.具有跟随性(依据这个特点,能省很多的relative,并且扩展性更强). 骚操作:使用注释来消除空格 <!doctype html> <html> &l

css基础语法一(选择器与css导入方式)

页面中,所有的CSS代码,需要写入到<style></style>标签中.style标签的type属性应该选择text/css,但是type属性可以省略. CSS修改页面中的所有标签,必须借助选择器选中.选择器中,可以写多对CSS属性,用{}包裹: 每个属性名与属性值之间用:分隔,多对属性之间,必须用;分隔.         选择器{                    属性1:属性值1;                    属性2:属性值2;                 

css基础 网站推荐-W3C 在线验证css

礼悟:    公恒学思合行悟,尊师重道存感恩.叶见寻根三返一,江河湖海同一体.          虚怀若谷良心主,愿行无悔给最苦.读书锻炼养身心,诚劝且行且珍惜.              ide:visual studio 2017             browser:Chrome                     os:win7 网页地址: http://validator.w3.org/unicorn/ 网页截图与说明 感想 给最苦 通过文件上传的方式进行验证CSS代码,看到那个

CSS深入理解之float(HTML/CSS)

float的设计初衷仅仅是:为了文字环绕效果 float的包裹与破坏 包裹:收缩.坚挺.隔绝(BFC) 破坏:父元素高度塌陷 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Layout</title> <style> .box{ border: 1px solid red; width: 300px; margin: 20px

CSS深入理解之overflow(HTML/CSS)

简介 overflow看上去其貌不扬,其中蕴含的知识点还是很多的,有很多鲜为人知的特性表现. overflow基本属性值 1.visible(默认) 2.hidden 3.scroll 4.auto 5.inherit body/html与滚动条 无论什么浏览器,默认滚动条均来自html标签,而不是body标签.因为新建一个空白html页面,body默认有margin值,如果滚动条来自body,则应该有边距,而不是紧贴着浏览器的边缘. body/html与滚动条(滚动高度) Chrome浏览器:

前端知识学习一 :CSS基础

一.CSS概述 css指的是层叠样式表,样式定义如何显示HTML元素,样式通常存储在样式表中, 把样式添加到HTML4.0中,是为了解决内容和表现分离的问题.外部样式表通常存储在css文件     中.多个样式定义可层叠为一. 二.层叠次序 一般而言,所有的样式都会根据下面的规则层叠于一个新的虚拟样式表中,其中4拥有最高的优先权. 1.浏览器的缺省设置 2.外部样式表(通过引入的外部.css文件) 3.内部样式表(位于<head>标签内部) 4.内联样式表(在HTML元素内部) 因此属性的优先

前端开发:css基础知识之盒模型以及浮动布局。

前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把它写到我的博客中,想知道自己过来翻就好啦 ^_^  下面楼主把当前的自己对css的基础认知一一给大家道来...... 盒模型 谈到盒模型,有经验的小伙伴一定滚瓜烂熟,无非就是 内容(content).填充(padding).边框(border).边界(margin): 这些属性我们可以把它转移到我们

Html5开发——html+css基础一(百度首页)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>百度</title> <style type="text/css"> *{margin: 0;padding: 0;} body{text-align: center;} .header{text-align: right;f

CSS初步理解

最近在学习牛腩的时候遇到了网页的制作,挺新鲜的.当中涉及到了有关CSS的知识,于是乎自己也就花费两个小时的时间,找了本浅显易懂的书来看了一遍,从宏观上来了解CSS的相关内容.有关CSS的基础知识详见下链接. CSS基础知识 以下是对CSS理解的导图 通过上图我们也发现,CSS也很难,也容易.容易是说,学起来很快就可以上手,这中语言简单易懂,只要你具备小学英语的知识量就可以了.困难是在指学好它并不容易,因为它需要你耐心.就好比我们对word文档的排版,哪里需要主体鲜明一点,哪里需要着重突出一下,哪