分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 前端开发

引用CSS

发布时间:2023-09-06 02:09责任编辑:林大明关键词:CSS
就目前来看,学的东西都很基础,这里把整理好的笔记贴上去,希望刚踏入前端的我们能够理解的更加清晰。引用css1.外部样式表,开发者一般使用它较为方便2.内部样式表3.行内样式表 2和3一般用于测试的时候外部样式表:css代码在一个独立的文件中,HTML通过link元素引入到页面(link是空元素)代码表现为: h1{ ?????color:red ????} 特点:没有了样式表文件,在某些时候可以提升效率多个页面难以共享样式,不利于代码复用。html和css代码混杂,不利于程序员和搜索引擎阅读在某些对效率要求苛刻或测试的场景下使用行内样式表:css代码写在元素的style属性中,行内样式不写选择器特点:没有了样式表文件,在某些时候可以提升效率多个页面难以共享样式,不利于代码复用。html和css代码混杂,不利于程序员和搜索引擎阅读javascript操作的是行内样式表在测试的场景下使用 注:同一个页面,同一个元素,分别用不同CSS引用不同样式添加,那么行内样式优先级最高,权重最大拓展: 快捷键:对某一行进行注释。ctrl+? ,取消也是一样     多行标签:< h1 > * 多少行 五:CSS注释1.书写格式:/* 注释内容 */作用:描述代码功能浏览器解析css代码时回忽略注释内容2. css规则css代码由一个一个的规则组成 每个规则指定了对哪些元素应用什么样式 h1{color:red;text-align:center;} 这里,“ h1” 是选择器,“{ }”里面的是声明快 选择器表示:该样式规则应用到哪些元素上 声明块表示:有哪些样式规则元素选择器 书写格式:标记名{ 声明块} 所有与该标记名匹配的元素,都将应用声明快中的规则。 例:h1{color:red;text-align:center;}类选择器 书写格式: . (英文点)类名(自定义){ 声明块 } 所有class属性为指定类名的元素,都将应用声明块中的规则。 例:css代码   .bigfont{font-size:18px;}    .redcolor{color:red;}      html代码  

neir

  
    

内容

  
      

内容

     ID选择器 书写格式: # id值(自定义){ 声明块 } 属性id为指定值得元素,将应用声明块中的规则 在同一个HTML文档中,元素的id值必须唯一 例 :css代码   big{font-size:18px;}      html代码   

内容

   注:ID选择器的权重最高,其次是类,最后是元素选择器 属性名小写,属性值用双引号六:语义化div元素用来划分区域,没有任何含义。语义化结构元素,这是后来出现的,为了使别人(搜索引擎)能够更清楚这个区域的含义。语义化标签=结构化标签         < header>       < nav >   < aside>      < article>   < section>         < footer >       一个页面的结构 < header >:用于表示页面或某个区域的头部,一个页面中可以出现多次。 < nav >: 用于表示导航栏,一般接一个img图片标签 < aside >:用于表示跟周围主题相关的附加信息。侧边栏,广告之类的。 < article >: 用于表示文章或其他可独立页面存在的内容。< article >可以嵌套,下面可以再接一个< article >,表示另一个独立内容。 < section >:  用于表示一个整体的一部分主题。多个< section >组成< article>,一般用于学术性文章的章节划分。 < footer >: 一般写在页面最下面的部分,比如: 地址,电话。超链接< a >元素书写格式: 1. < a href=”目标” > 内容 < /a >写页面地址(路径)锚点(同个页面的跳转)功能链接 例: 页面地址: < a href=”group.html” >点开进行分组< /a > 锚点: < a href=”#qwe”> 内容 < /a > 跳转到< h1 id=”qwe” > 内容 < /h1 > 功能链接: < a href=”tel:18258415412” > 给我打电话 < /a > 拨电话功能,前提条件:客户端(用户使用的电脑)安装拨号功能,手机 < a href=”mailto:12345@qq.com” > 发邮件 < /a > 发送邮件功能,客户端(用户使用的电脑)安装了发送邮件功能的软件。2. < a target=”页面打开位置” href=”目标” > 内容 < /a >    _blank新窗口中打开   _ self默认值,当前窗口中打开(也可以不写) < a target=”_blank” href=”目标” > 内容 < /a >**

引用CSS

原文地址:https://www.cnblogs.com/ll0627/p/9465405.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved