分享web开发知识

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

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

css基础(css书写 背景设置 标签分类 css特性)

发布时间:2023-09-06 01:07责任编辑:傅花花关键词:暂无标签
 
css书写位置
 
行内式写法
<p style="color:red;" font-size:12px;></p>

外联式写法

<link rel="stylesheet " href="地址" type="text/css"/>
嵌入式写法
<style type="css/stylesheet"> ?p{ font-size:20px; color:red; }</style>

注意:3个不同书写方式的优先级:行内式>嵌入式>外联式(在多少项目中为了保持代码的整洁,都会用嵌入式。维护性高,影响范围广,当整个网站的站点。)

html标签分类
块级元素
典型代表:div、p、li、h1
特点:元素自己独占一行显示(与宽度无关)
           可以设置宽度和高度
            当嵌套一个块级元素,子元素如果不设置宽度,那么该子元素的宽度为父元素的宽度。
 
行内元素:
典型代表:span 、a、font、strong……
特点:元素在一行显示
            不能直接设置宽度高度
<span>我</span><span>是</span><span>国</span><span>人</span>
行内块元素
典型代表:Image,input (表单控件)
特点:元素在一行上显示
          可以设置宽度和高度
 
元素之间的转换
 
display:inline    将元素转化为行内元素
div{width:10px; height:10px; display:block;}

display:inline-block  将元素转化为行内块元素

div{ width:300px; height:20px; display:inline;}

display:block  将元素转化为块元素

a{ display:block; width:20px; height:30px;}

 Css特性

继承性
继承关系:嵌套标签之间,子级会继承父级元素的样式(备注:有关文字的属性都可以继承)
特殊性:a 标签的颜色不能继承,必须对a标签本身进行设置
               H标签的文字大小不能改变,必须对H标签本身进行修改
 
层叠性
样式的覆盖,样式的层叠与类名顺序没有关系,与样式定义顺序有关
.two{color:green;}.now{color:red;}<p class="noe two"></p>//红色
优先级
!impotrant > 行内样式 > id选择器 > 类选择器 > 标签选择器 > 通配符>继承
<style type="text/css"> ?p{ color:red; !important; //优先级最大,红色 ????color:#foo;}<style><p>sssss<p>
css优先级法则
1、选择器都有一个权值,权值越大越优秀
2、当权值相等时,后出现的样式设置要优先于先出现的样式设置
3、创造者的规则高于游览者:网页编写者设置的css样式的优先权高于浏览器所设置的颜色
4、继承的css样式不如后来制定的css样式;

css基础(css书写 背景设置 标签分类 css特性)

原文地址:http://www.cnblogs.com/wdz1/p/7516655.html

知识推荐

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