这样的标签,HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成,而不使用任何的格式化标签。
由于两种主要的浏览器(Netscape 和 Internet Explorer)不断地将新的 HTML 标签和属性(比如字体标签和颜色属性)添加到 HTML 规范中,创建文档内容清晰地独立于文档表现层的站点变得越来越困难。
为了解决这个问题,万维网联盟(W3C),这个非营利的标准化联盟,肩负起了 HTML 标准化的使命,并在 HTML 4.0 之外创造出样式(Style)。
所有的主流浏览器均支持层叠样式表。
多重样式将层叠为一个
样式表允许以多种方式规定样式信息。样式可以规定在单个的 HTML 元素中,在 HTML 页的头元素中,或在一个外部的 CSS 文件中。甚至可以在同一个 HTML 文档内部引用多个外部样式表。
层叠次序
当同一个 HTML 元素被不止一个样式定义时,会使用哪个样式呢?
一般而言,所有的样式会根据下面的规则层叠于一个新的虚拟样式表中,其中数字 4 拥有最高的优先权。
浏览器缺省设置
外部样式表
内部样式表(位于 标签内部)
内联样式(在 HTML 元素内部)
因此,内联样式(在 HTML 元素内部)拥有最高的优先权,这意味着它将优先于以下的样式声明:
标签中的样式声明,外部样式表中的样式声明,或者浏览器中的样式声明(缺省值)。
一、css的语法
格式:
选择器{属性:值;属性:值;属性:值;....}
其中选择器也叫选择符
CSS中注释:
/* ... */
二、在HTML中如何使用css样式(html中嵌入css的方式)
内联方式(行内样式) 就是在HTML的标签中使用style属性来设置css样式 格式: 被修饰的内容``
在HTML中如何使用css样式
特点:仅作用于本标签
内部方式(内嵌样式) 就是在head标签中使用标签来设置css样式 格式: 特点:作用于当前整个页面
外部导入方式(外部链入) 3.1 (推荐)就是在head标签中使用 标签导入一个css文件,在作用于本页面,实现css样式设置 格式: 3.2 还可以使用import在style标签中导入css文件。 格式: 特点:作用于整个网站 俩种导入方式的区别:
link属于html,而@import则属于css
@import 不能写在内嵌样式的上方 否则样式无效 格式: 不生效 下面的写法生效
加载顺序区别 加载页面时,link标签引入的 CSS 被同时加载;@import引入的 CSS 将在页面加载完毕后被加载。
兼容性区别 @import是 CSS2.1 才有的语法,故只可在 IE5+ 才能识别;link标签作为 HTML 元素,不存在兼容性问题。 他们的优先级:当样式冲突时,就是采用就近原则,是值css属性离被修饰的内容最近的为主。 若没有样式冲突则采用叠加效果。
三、**css2的选择符:
html选择符(标签选择器)
就是把html标签作为选择符使用 如 p{....} 网页中所有p标签采用此样式
h2{....} 网页中所有h2标签采用此样式
class类选择符 (使用点.将自定义名(类名)来定义的选择符)(类选择器)
定义: .类名{样式....} 匿名类
其他选择符名.类名{样式....} 使用:...
.mc{color:blue;} /* 凡是class属性值为mc的都采用此样式 */
p .ps{color:green;} /只有p标签中class属性值为ps的才采用此样式 /
注意:类选择符可以在网页中重复使用
3.Id选择符(ID选择器)
定义: #id名{样式.....} 使用:...
注意:id选择符只在网页中使用一次
选择符的优先级:从大到小 [ID选择符]->[class选择符]->[html选择符]->[html属性]
4.关联选择符(包含选择符)
格式: 选择符1 选择符2 选择符3 ...{样式....} 例如: table a{....} /table标签里的a标签才采用此样式 /
h1 p{color:red} /*只有h1标签中的p标签才采用此样式*/
5.组合选择符(选择符组)
格式: 选择符1,选择符2,选择符3 ...{样式....}
h3,h4,h5{color:green;} /*h3、h4和h5都采用此样式*/
6.*通配符(全局选择器)
说明:
通配符的写法是“*”,其含义就是所有元素。
用法:
常用来重置样式
*{ padding:0; margin:0;}
伪类选(伪元素)择符: 格式: 标签名:伪类名{样式....} a:link {color: #FF0000; text-decoration: none} /* 未访问的链接 */
a:visited {color: #00FF00; text-decoration: none} /* 已访问的链接 */
a:hover {color: #FF00FF; text-decoration: underline} /* 鼠标在链接上 */
a:active {color: #0000FF; text-decoration: underline} /* 激活链接 */
为了简化代码,可以把伪类选择符中相同的声明提出来放在a选择符中; 例如: a{color:red;} a:hover{color:green;} 表示超链接的三种状态都相同,只有鼠标划过变颜色。 伪类(Pseudo classes)是选择符的螺栓,用来指定一个或者与其相关的选择符的状态
属性选择器: ...
其他伪类选择器 ...
优先级:行内->css3选择器->id->class->html->html属性
四、 CSS3中的选择器
关系选择器:
div>p 选择所有作为div元素的子元素p div+p 选择紧贴在div元素之后p元素 div~p 选择div元素后面的所有兄弟元素p
属性选择器:
[attribute]选择具有attribute属性的元素。 [attribute=value]选择具有attribute属性且属性值等于value的元素。 [attribute~=value]选择具有attribute属性且属性值为一用空格分隔的字词列表,其中一个等于value的元素。 [attribute|=value]选择具有att属性且属性值为以val开头并用连接符"-"分隔的字符串的E元素。
div[class|="a"] class="a-test"
[attibute^=value]匹配具有attribute属性、且值以valule开头的E元素 [attribute$=value]匹配具有attribute属性、且值以value结尾的E元素 [attribute*=value]匹配具有attribute属性、且值中含有value的E元素 浏览器兼容性问题: 不用担心浏览器兼容问题,也不用考虑IE浏览器版本问题。
CSS 伪类用于向某些选择器添加特殊的效果。
结构性伪类选择器:
::first-letter设置对象内的第一个字符的样式。 ::first-line设置对象内的第一行的样式。 :before设置在对象前(依据对象树的逻辑结构)发生的内容。
定义和用法
:before 选择器在被选元素的内容前面插入内容。
请使用 content 属性来指定要插入的内容。
content不能省略
:after设置在对象后(依据对象树的逻辑结构)发生的内容。
定义和用法
:before 选择器在被选元素的内容后面插入内容。
请使用 content 属性来指定要插入的内容。
content不能省略
:first-of-type匹配同类型中的第一个同级兄弟元素 :last-of-type匹配同类型中的最后一个同级兄弟元素 表示其父元素下的最后一个指定类型的元素。
:only-of-type匹配同类型中的唯一的一个同级兄弟元素
:nth-last-of-type(n) 匹配同类型中的倒数第几个同级兄弟元素
:nth-of-type(n) 匹配同类型中的第几个同级兄弟元素
:only-child匹配父元素仅有的一个子元素 :nth-last-child(n)匹配同类型中的倒数第n个同级兄弟元素 :first-child()匹配父元素的最后一个子元素 :last-child()匹配父元素的最后一个子元素 其父元素的最后一个子元素,且这个元素是css指定的元素,才可以生效
:nth-child(n)匹配父元素的第n个子元素
实例:
li:nth-child(2n){color:#f00;} /* 偶数 */
li:nth-child(2n+1){color:#000;} /* 奇数 */
child和type区别:
child所指定的必须为第一个或者最后一个 否则不生效 但是type可以
:root匹配元素在文档的根元素。在HTML中,根元素永远是HTML :empty匹配没有任何子元素(包括text节点)的元素 :not(selector)匹配不含有selector选择符的元素
.demo li:not(:last-child) {
border-bottom: 1px solid #ddd;
}
上述代码的意思是:给该列表中除最后一项外的所有列表项加一条底边线
*状态伪类选择器
:link 设置超链接a在未被访问前的样式。 :visited 设置超链接a在其链接地址已被访问过时的样式 :active 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式 *:hover 设置元素在其鼠标悬停时的样式 *:focus 设置元素在其获取焦点时的样式 :target 匹配相关URL指向的E元素 将锚点跳转的代码进行设置
#my_md:target{}
:enabled 匹配用户界面上处于可用状态的元素 :disabled 匹配用户界面上处于禁用状态的元素 :checked 匹配用户界面上处于选中状态的元素
实例:
input:checked + span {
background: #f00;
}
input:checked + span:after {
content: " 我被选中了";
}
::selection 设置对象被选择时的样式
实例:
p::selection{background:#000;color:#f00;}
你选中这段文字后,看看它们的文本颜色和背景色,就能明白::selection的作用。
只能定义被选择时的background-color,color及text-shadow(IE11尚不支持定义该属性)。
!important 应用优先权 .test {important color: #f00 !important; color: #000; }
伪类就是创建了一个假的类名;伪元素就是创建了一个假的元素标签。
同样举例说明伪元素(就是创建了假的元素):如让
啊啦啦啦
里面的啊变颜色 我们的一般做法是啊啦啦啦
然后span{color:red} 但是用伪元素就不用创建新元素span了,直接p::first-letter{color:red}就可以搞定了是不是很爽啊,相当于创建了一个假的元素span然而实际并没有创建
======================================================================================
五、CSS中常用的属性:
(1) color颜色属性:
a. HSL颜色: 通过对色调(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色.
background-color: hsl(240,100%,50%);color:white;
b. HSLA颜色: 色调(H)、饱和度(S)、亮度(L)、透明度(A);
background-color: hsla(0,100%,50%,0.2);
*c. RGB颜色: 红(R)、绿(G)、蓝(B)三个颜色通道的变化
background-color: rgba(200,100,0);
d. RGBA颜色: 红(R)、绿(G)、蓝(B)、透明度(A)
background-color: rgba(0,0,0,0.5);
*e. 图片透明度的设置 img.opacity{ opacity:0.25;}
兼容IE8 filter:alpha(opacity=100);
颜色的使用:
颜色的英文单词
十六进制
rgb
(2) 字体属性: font
font *font-size: 字体大小:20px,60%基于父对象的百分比取值 *font-family: 字体:宋体,Arial font-style: normal正常;italic斜体; oblique倾斜的字体 *font-weight: 字体加粗 :bold font-variant: small-caps 小型的大写字母字体 font-stretch: [了解]文字的拉伸是相对于浏览器显示的字体的正常宽度(大部分浏览器不支持)。
<' font-style '>: 指定文本字体样式 <' font-variant '>: 指定文本是否为小型的大写字母 <' font-weight '>: 指定文本字体的粗细 <' font-size '>: 指定文本字体尺寸 <' line-height '>: 指定文本字体的行高 tvls <' font-family '>: 指定文本使用某个字体或字体序列 且font-size和font-family是不可忽略
(3) 文本属性:
text-indent: 首行缩进:2em text-indent:30px; text-overflow: 文本的溢出是否使用省略标记(...)。clip|ellipsis(显示省略标记) *text-align: 文本的位置:left center right text-transform:对象中的文本的大小写:capitalize(首字母)|uppercase大写|lowercase小写 *text-decoration: 字体画线:none无、underline下画线,line-through贯穿线 text-decoration-line:[了解]文本装饰线条的位置(浏览器不兼容)
*text-shadow: 文本的文字是否有阴影及模糊效果 vertical-align: 文本的垂直对齐方式 middle居中 direction:文字流方向。ltr | rtl
white-space:nowrap; /* 强制在同一行内显示所有文本*/
*letter-spacing: 文字或字母的间距 word-spacing:单词间距 *line-height:行高 *color: 字体颜色 word-break:break-all;单词换行
(4) *边框:
border:宽度 样式 颜色;
border-color;
border-style; 边框样式:solid实现,dotted点状线,dashed虚线
border-width:
border-left-color;
border-left-style;
border-left-width:
...
CSS3的样式
border-radius:圆角处理
box-shadow: 设置或检索对象阴影
三角
div{
border: 14px solid #FFF;
width:0;
height: 0;
border-bottom-color:red;
}
(5) 背景属性:background
*background-color: 背景颜色 *background-image: 背景图片 *background-repeat:是否重复,如何重复?(平铺)
repeat-x 按照x轴平铺
repeat-y 按照y轴平铺
no-repeat 不平铺
*background-position:定位
center: 背景图像横向和纵向居中。
left: 背景图像在横向上填充从左边开始。
right: 背景图像在横向上填充从右边开始。
top: 背景图像在纵向上填充从顶部开始。
bottom: 背景图像在纵向上填充从底部开始。
background-attachment:[əˈtætʃmənt] 是否固定背景,
scroll:默认值。背景图像是随对象内容滚动
fixed:背景图像固定
css3的属性
*background-size: 背景大小,如 background-size:100px 140px;
组合写法:
background: green url("./sc/1.gif") no-repeat center/200px 300px scroll;
多层背景: background:url(test1.jpg) no-repeat scroll 10px 20px,url(test2.jpg) no-repeat scroll 50px 60px,url(test3.jpg) no-repeat scroll 90px 100px; background-origin:content-box,content-box,content-box; background-clip:padding-box,padding-box,padding-box; background-size:50px 60px,50px 60px,50px 60px;
(6) *内补白(内补丁)
padding: 检索或设置对象四边的内部边距,如padding:10px; padding:5px 10px; padding-top: 检索或设置对象顶边的内部边距 padding-right: 检索或设置对象右边的内部边距 padding-bottom:检索或设置对象下边的内部边距 padding-left: 检索或设置对象左边的内部边距 box-sizing: border-box;
盒子模型
css定义所有的元素都可以拥有像盒子一样的外形和平面空间,即都包含边框(border)、外边距(margin)、内边距(padding)、内容区(content)。 计算公式: 宽 =左右margin+左右border+左右padding+内容width 高 =上下margin+上下border+上下padding+内容height
怪异盒子模型
/* 切换盒子模型计算方式
*
* 从边框左边到边框右边之间的距离 才是width
* 计算宽度非常方便
*
*/
box-sizing: border-box;
(7) *外补白(外补丁)
margin: 检索或设置对象四边的外延边距,如 margin:10px; margin:5px auto; margin-top: 检索或设置对象顶边的外延边距 margin-right: 检索或设置对象右边的外延边距 margin-bottom: 检索或设置对象下b边的外延边距 margin-left: 检索或设置对象左边的外延边距
注意:
外边距的上下距离会重叠 左右不会重叠
(8) Position定位
*position: 定位方式:absolute(绝对定位)、fixed(固定)(relative定位参考,可对内部相对absolute定位) *z-index: 层叠顺序,值越大越在上方。 *top: 检索或设置对象与其最近一个定位的父对象顶部相关的位置 right: 检索或设置对象与其最近一个定位的父对象右边相关的位置 bottom: 检索或设置对象与其最近一个定位的父对象下边相关的位置 *left: 检索或设置对象与其最近一个定位的父对象左边相关的位置
总结:
fixed和absolute绝对定位 不会保留其物理空间 设置当前定位的元素会漂浮在其它元素的上方
定位会参照外层的定位而定位 如果外层嵌套的标签不存在定位 则会按照body体进行定位
fixed和absolute使用除了fixed会随着滚动条的滚动而滚动之外 使用方式一样的
设置div相对于浏览器居中显示
position:absolute;
left:0;
top:0;
bottom:0;
right: 0;
margin: auto;
(9) Layout布局
*display: 是否及如何显示:
none隐藏
block块状显示
inline 行级
inline-block 行级的块级标签 *float:指出了对象是否及如何浮动:值none | left | right *clear:清除浮动:none | left | right | both两侧 visibility:设置或检索是否显示对象。visible|hidden|collapse。 与display属性不同,此属性为隐藏的对象保留其占据的物理空间 clip:检索或设置对象的可视区域。区域外的部分是透d明的。 rect(上-右-下-左) 如:clip:rect(auto 50px 20px auto);上和左不裁剪,右50,下20.
*overflow:超出隐藏:hidden,visible:不剪切内容 overflow-x:内容超过其指定宽度时如何管理内容: visible | hidden | scroll | auto overflow-y:内容超过其指定高度时如何管理内容
图片格式(了解)
png 常用的网络传输格式,开发中用的最多的格式 HTML常用,
移动开发(Android,IOS,WP),这个格式文件失真率低
jpg 比较常用的图片格式,压缩性能比较高,不支持透明像素 失真率比较高
gif 动态图片,不透明的,占用空间比较高
psd Photoshop的原图,PS超级大,但是可以保留图片原始所有资料
webp Google定义的,它集合了png和jpg的优点 支持透明像素,空间占用低
新增CSS3选择器及属性只需在选择器或属性前加上相对应的浏览器前缀即可
-webkit- Chrome -moz- FF -ms- IE -o- Opera
(10) 用户界面 User Interface
*cursor 鼠标指针采用何种系统预定义的光标形状。pointer小手,url自定义
zoom 设置或检索对象的缩放比例: normal|5倍|200%百分比 box-sizing 设置或检索对象的盒模型组成模式。content-box | border-box
content-box: padding和border不被包含在定义的width和height之内。 border-box: padding和border被包含在定义的width和height之内。
resize 设置或检索对象的区域是否允许用户缩放,调节元素尺寸大小。
none: 不允许用户调整元素大小。
both: 用户可以调节元素的宽度和高度。
horizontal: 用户可以调节元素的宽度
vertical: 用户可以调节元素的高度。
outline 复合属性:设置或检索对象外的线条轮廓
outline-width设置或检索对象外的线条轮廓的宽度 outline-style设置或检索对象外的线条轮廓的样式 outline-color设置或检索对象外的线条轮廓的颜色 outline-offset设置或检索对象外的线条轮廓偏移位置的数值
(11) 表格相关属性:
border-collapse 设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开 separate | collapse border-spacing 设置或检索当表格边框独立时,行和单元格的边框在横向和纵向上的间距 caption-side 设置或检索表格的caption对象是在表格的那一边 top | bottom empty-cells 设置或检索当表格的单元格无内容时,是否显示该单元格的边框 hide | show
(12) 过渡 Transition:
transition 检索或设置对象变换时的过渡效果 transition-property 检索或设置对象中的参与过渡的属性 transition-duration 检索或设置对象过渡的持续时间 transition-timing-function 检索或设置对象中过渡的类型 transition-delay 检索或设置对象延迟过渡的时间
(13) 动画 Animation
animation 检索或设置对象所应用的动画特效 animation-name 检索或设置对象所应用的动画名称 animation-duration 检索或设置对象动画的持续时间 animation-timing-function 检索或设置对象动画的过渡类型 animation-delay 检索或设置对象动画延迟的时间 animation-iteration-count 检索或设置对象动画的循环次数 animation-direction 检索或设置对象动画在循环中是否反向运动 alternate animation-play-state 检索或设置对象动画的状态 animation-fill-mode 检索或设置对象动画时间之外的状态
(14) 2D变换 2D Transform:
transform 检索或设置对象的变换 transform-origin 检索或设置对象中的变换所参照的原点
你可能感兴趣的:(css入门)
CSS3学习教程,从入门到精通,CSS3 列表样式语法知识点及案例代码(8)
知识分享小能手
前端开发 网页开发 编程语言如门 css3 学习 前端 css html5 html Java开发
CSS3列表样式语法知识点及案例代码一、列表样式类型1.list-style-type属性用于指定列表项标记的样式类型。语法格式:list-style-type:;取值说明:对于无序列表(),常见的取值有:disc:实心圆(默认值)。circle:空心圆。square:实心方块。none:无标记。对于有序列表(),常见的取值有:decimal:数字(默认值)。lower-roman:小写罗马数字。
CSS3学习教程,从入门到精通,CSS3 选择器权重问题语法知识点及案例代码(5)
知识分享小能手
网页开发 编程语言如门 前端开发 css3 学习 前端 html5 html java css
CSS3选择器权重问题语法知识点及案例代码一、选择器权重概述在CSS中,当多个选择器同时匹配同一个元素时,浏览器会根据选择器的权重来决定哪个样式生效。权重高的选择器的样式会覆盖权重低的选择器的样式。二、选择器权重计算规则1.内联样式(InlineStyles)内联样式直接写在HTML元素的style属性中,权重为1000。2.ID选择器(IDSelectors)ID选择器以#开头,权重为100。3
CSS3学习教程,从入门到精通,CSS3 常用文本属性语法知识点及案例代码(6)
知识分享小能手
前端开发 网页开发 编程语言如门 css3 学习 前端 css html5 javascript web开发
CSS3常用文本属性语法知识点及案例代码一、文本颜色(color)语法:color:;取值:颜色名称:例如red,blue,green等十六进制颜色值:例如#ff0000,#00ff00,#0000ff等RGB颜色值:例如rgb(255,0,0),rgb(0,255,0),rgb(0,0,255)等RGBA颜色值:例如rgba(255,0,0,0.5),rgba(0,255,0,0.5),rgba
CSS3学习教程,从入门到精通, CSS3 样式引入语法知识点及案例代码(2)
知识分享小能手
前端开发 网页开发 编程语言如门 css3 学习 前端 html5 html 开发语言 css
CSS3样式引入语法知识点及案例代码一、CSS3样式引入方式CSS3样式可以通过以下几种方式引入到HTML文档中:1.内联样式(InlineStyles)语法:直接在HTML元素的style属性中编写CSS代码。优点:优先级最高,方便调试。缺点:不利于维护和复用,代码冗余。案例:这是一个段落。2.内部样式表(InternalStyleSheet)语法:在HTML文档的标签内使用标签定义CSS样式。
HTML 样式与布局初体验:学习进程中的关键节点(二)
计算机毕设定制辅导-无忧学长
# HTML html 学习 css
学习中的困难与突破在学习HTML样式与布局的过程中,我也遇到了不少困难,这些困难就像是学习道路上的绊脚石,但也正是在克服它们的过程中,我实现了自我的突破和成长。(一)样式冲突:规则的碰撞样式冲突是我遇到的第一个难题。当使用多个CSS规则来定义同一个元素的样式时,由于选择器的优先级和规则的先后顺序不同,经常会出现样式不符合预期的情况。比如,我在一个项目中,同时使用了外部样式表和内嵌样式来设置按钮的样
css填充容器背景色,一半一种颜色
77n
前端 css 容器 css3
background:linear-gradient(toright,#C3002F50%,#e8e8e80);
【CSS】background-position属性详解
Peter-Lu
# CSS css 前端 node.js html javascript
文章目录一、background-position属性概述1.属性介绍2.属性的取值3.属性的默认值二、background-position的基本用法1.使用关键字2.使用百分比3.使用像素值4.混合使用关键字与百分比/像素值三、background-position属性详解1.关键字定位2.百分比定位3.长度值定位四、background-position的实际应用场景1.背景图像居中显示2.
React封装通用Form组件,类型转换、命名控件样式隔离、支持表单验证、位置自定义、自定义布局、提示信息info等功能。未采用二次封装调整灵活,包含使用文档
夜斗(dou)
react.js javascript ecmascript
封装通用组件一、封装思想二、react代码三、css代码四、实现效果五、使用文档BasicFormModal表格模态框组件组件简介功能特点使用方法基础用法宽度和位置控制使用初始值多种输入类型示例表单验证字段提示信息禁用字段自定义样式更新日志v1.0.0API说明PropsFormField配置项dataType数据类型选项Rule配置项Option配置项数据类型使用示例数值类型示例布尔类型示例注意
纯代码非插件实现wordpress右侧悬浮在线客服咨询台
wodrpress资源分享
wordpress wordpress
为了创建一个悬浮在右侧的在线客服咨询台,您可以使用HTML和CSS。以下是一个简单的示例,包含了QQ咨询和微信咨询的链接。HTML代码:在线客服咨询台QQ咨询微信咨询CSS代码:#right-sidebar{width:200px;height:100vh;position:fixed;right:0;top:0;background-color:#f5f5f5;padding:20px;}#on
CSS 自适应图片根据 div 大小进行均匀填充
前端小助手
css tensorflow 前端
目录前言使用object-fit属性示例代码HTMLCSS总结相关阅读1.前言在Web开发中,经常需要图片根据其容器的大小进行自适应填充,使得图片在任何设备和屏幕尺寸下都能保持良好的显示效果。本文将介绍如何使用CSS中的object-fit属性来实现这一需求。2.使用object-fit属性object-fit是一个CSS属性,专门用于控制替换元素(如、等)在其容器内的显示方式。常用的值有:fil
信息收集之 子域名收集,子域名爆破_dnsdumpster
2401_89829398
网络
「作者主页」:士别三日wyx「作者简介」:CSDNtop100、阿里云博客专家、华为云享专家、网络安全领域优质创作者「专栏简介」:此文章已录入专栏《网络安全快速入门》子域名收集一、域名爆破原理二、搜索引擎收集子域名三、第三方网站收集子域名1.VirusTotal2.DNSdumpster四、工具收集子域名子域名就是下一级域名的意思,比如map.baidu.com和image.baidu.com就是
Python入门到精通(三):数据结构第一部分
love9599
Python入门到精通 python 开发语言
python的常用数据结构类型字符型字典列表元组、集合一、序列序列:是python中的一类数据类型,比如字符串、列表序列类型的对象是可以进行循环变例的1.1序列特性索引:指的是在序列中找到指定元素的索引编号切片:指的是从序列中提取一部分内容加法:序列对象可以将多个序列合并成一个乘法:可以将序列通过乘法输出多个相同的1.2序列操作索引操作格式:序列名[索引值]#案例1:str1="hello"#定义
【go从入门到精通】探秘struct结构体转json为什么需要首字母大写?
前网易架构师-高司机
golang从入门到精通 golang json go 结构体首字母大写 golang从入门到精通 go从入门到精通
目录作者简介:问题抛出分析结论作者简介:高科,先后在IBMPlatformComputing从事网格计算,淘米网,网易从事游戏服务器开发,拥有丰富的C++,go等语言开发经验,mysql,mongo,redis等数据库,设计模式和网络库开发经验,对战棋类,回合制,moba类页游,手游有丰富的架构设计和开发经验。并且深耕深度学习和数据集训练,提供商业化的视觉人工智能检测和预警系统(煤矿,工厂,制造业
【动手学深度学习】#1PyTorch基础操作
-一杯为品-
机器学习 深度学习 人工智能
主要参考学习资料:《动手学深度学习》阿斯顿·张等著【动手学深度学习PyTorch版】哔哩哔哩@跟李牧学AI目录1.1数据操作1.1.1入门1.1.2运算符1.1.3广播机制1.1.4索引和切片1.1.5节省内存1.1.6转换为其他Python对象1.2数据预处理1.2.1读取数据集1.2.2处理缺失值1.2.3转换为张量格式1.3线性代数1.3.1标量1.3.2向量1.3.3矩阵1.3.4张量1.
IPC Kit基础入门:理解HarmonyOS的进程间通信架构
SameX-4869
harmonyos 架构 华为
本文旨在深入探讨华为鸿蒙HarmonyOSNext系统(截止目前API12)的技术细节,基于实际开发实践进行总结。主要作为技术分享与交流载体,难免错漏,欢迎各位同仁提出宝贵意见和问题,以便共同进步。本文为原创内容,任何形式的转载必须注明出处及原作者。在HarmonyOS应用开发中,进程间通信(IPC)是构建复杂应用架构的关键要素。IPCKit为开发者提供了强大的进程间通信能力,使不同进程之间能够高
HarmonyOS NEXT开发笔记:@Computed装饰器计算属性
我很英俊 小名男男
OpenHarmony 鸿蒙开发 HarmonyOS harmonyos 华为 开发语言 前端 鸿蒙 移动开发 鸿蒙系统
鸿蒙开发往期必看:一分钟了解”纯血版!鸿蒙HarmonyOSNext应用开发!“非常详细的”鸿蒙HarmonyOSNext应用开发学习路线!(从零基础入门到精通)
[QMT量化交易小白入门]-二十二、deepseek+cline+vscode,让小白使用miniQMT量化交易成为可能
python自动化工具
QMT量化交易小白入门 vscode ide 编辑器
本专栏主要是介绍QMT的基础用法,常见函数,写策略的方法,也会分享一些量化交易的思路,大概会写100篇左右。QMT的相关资料较少,在使用过程中不断的摸索,遇到了一些问题,记录下来和大家一起沟通,共同进步,自己淋过雨了,希望大家都有一把伞。文章目录相关阅读DeepSeek新用户注册cline集成指令测试相关阅读小白也能做量化:零门槛QMT、Ptrade免费送量化交易入门:如何在QMT中配置Pytho
python基础版课件_Python入门基础ppt课件.ppt
六间仓库的仓老师
python基础版课件
《Python入门基础ppt课件.ppt》由会员分享,可在线阅读,更多相关《Python入门基础ppt课件.ppt(30页珍藏版)》请在人人文库网上搜索。1、Python语言基础,1,Python诞生于20世纪90年代初,是一种解释型、面向对象、动态数据类型的高级程序设计语言,是最受欢迎的程序设计语言之一。这节课我们主要来介绍Python语言的基本情况和基础知识。,课程描述,2,课程知识点,1初识
Python从入门到实践电子书,python编程入门到实践pdf
小六oO
智能写作 python django 开发语言
《Python编程从入门到实践》txt下载在线阅读,求百度网盘云资源《Python编程》([美]埃里克·马瑟斯(EricMatthes))电子书网盘下载免费在线阅读资源链接:链接:提取码:6vcz书名:Python编程作者:[美]埃里克·马瑟斯(EricMatthes)译者:袁国忠豆瓣评分:9.2出版社:人民邮电出版社出版年份:2020-10页数:476内容简介:本书是针对所有层次Python读者
【2025年春季】全国CTF夺旗赛-从零基础入门到竞赛,看这一篇就稳了!
白帽子凯哥
web安全 学习 安全 CTF夺旗赛 网络安全
基于入门网络安全/黑客打造的:黑客&网络安全入门&进阶学习资源包目录一、CTF简介二、CTF竞赛模式三、CTF各大题型简介四、CTF学习路线4.1、初期1、html+css+js(2-3天)2、apache+php(4-5天)3、mysql(2-3天)4、python(2-3天)5、burpsuite(1-2天)4.2、中期1、SQL注入(7-8天)2、文件上传(7-8天)3、其他漏洞(14-15
【前端入门】应该了解和知道的几个国内外前端开发资源网站
爱上大树的小猪
前端
与大家分享一下几个国内外前端开发资源网站国际资源MDNWebDocs(MozillaDeveloperNetwork)用途:MDN是Web技术领域最全面的文档库之一,涵盖了HTML、CSS、JavaScript以及浏览器API等。链接:https://developer.mozilla.orgW3Schools用途:适合初学者学习Web技术,提供从基础到进阶的教程,同时还有在线练习环境。链接:ht
Python(1)Python全方位指南:定义、应用与零基础入门实战
一个天蝎座 白勺 程序猿
Python入门到精通 python 开发语言
背景:为什么Python成为开发者必备技能?Python自1991年发布以来,凭借“简单高效”的设计理念,成为全球增长最快的编程语言。根据TIOBE2023年榜单,Python稳居前三,其核心竞争力包括:开发效率高:代码量仅为Java的1/5,C++的1/10。跨领域通吃:从Web开发到AI训练,覆盖90%以上技术场景。企业级应用:YouTube用Python处理视频推荐,NAS
AI大模型从入门到精通,2025终极指南!好卷啊,又不能躺平,只能悄悄卷你们了!
大模型教程
人工智能 大模型训练 LLM 知识库 大模型 大模型入门 大模型学习
什么是AI大模型?AI大模型是指使用大规模数据和强大的计算能力训练出来的人工智能模型。这些模型通常具有高度的准确性和泛化能力,可以应用于各种领域,如自然语言处理、图像识别、语音识别等。为什么要学AI大模型?2024人工智能大模型的技术岗位与能力培养随着人工智能技术的迅速发展和应用,大模型作为其中的重要组成部分,正逐渐成为推动人工智能发展的重要引擎。大模型以其强大的数据处理和模式识别能力,广泛应用于
AI大模型学习路线:从入门到精通的完整指南【2025最新】
AI大模型-大飞
人工智能 学习 大模型 LLM AI 程序员 大模型学习
引言近年来,以GPT、BERT、LLaMA等为代表的AI大模型彻底改变了人工智能领域的技术格局。它们不仅在自然语言处理(NLP)任务中表现卓越,还在计算机视觉、多模态交互等领域展现出巨大潜力。本文旨在为开发者、研究者和技术爱好者提供一条清晰的学习路径,帮助读者逐步掌握大模型的核心技术并实现实际应用。一、基础阶段:构建知识体系数学与理论基础线性代数:矩阵运算、特征值与奇异值分解是大模型参数优化的基础
33.从入门到精通:Python3 正则表达式 re.match函数 re.search方法 re.match与re.search的区别
摘星月为妆。
Python从入门到精通 正则表达式
33.从入门到精通:Python3正则表达式re.match函数re.search方法re.match与re.search的区别Python3正则表达式re.match函数re.search方法re.match与re.search的区别Python3正则表达式在Python3中,可以使用re模块来进行正则表达式的匹配和处理。以下是一个简单的例子,说明如何使用re模块进行正则表达式匹配:import
计算机毕业设计springboot教务管理系统 0k1c1源码+系统+程序+lw文档+部署
呦呦网络
spring boot java mysql
计算机毕业设计springboot教务管理系统0k1c1源码+系统+程序+lw文档+部署计算机毕业设计springboot教务管理系统0k1c1源码+系统+程序+lw文档+部署本源码技术栈:项目架构:B/S架构开发语言:Java语言开发软件:ideaeclipse前端技术:Layui、HTML、CSS、JS、JQuery等技术后端技术:JAVA运行环境:Win10、JDK1.8数据库:MySQL5
Android15音频进阶之qnx定位so调用进程(一百一十一)
Android系统攻城狮
Android Audio工程师进阶系列 音视频 Android15 QNX 音频调试
简介:CSDN博客专家、《Android系统多媒体进阶实战》一书作者新书发布:《Android系统多媒体进阶实战》优质专栏:Audio工程师进阶系列【原创干货持续更新中……】优质专栏:多媒体系统工程师系列【原创干货持续更新中……】优质视频课程:AAOS车载系统+AOSP14系统攻城狮入门视频实战课
如何减少跨团队交付摩擦?——基于 DevOps 与敏捷的最佳实践
网罗开发
实战 实战源码 devops 运维
网罗开发(小红书、快手、视频号同名) 大家好,我是展菲,目前在上市企业从事人工智能项目研发管理工作,平时热衷于分享各种编程领域的软硬技能知识以及前沿技术,包括iOS、前端、HarmonyOS、Java、Python等方向。在移动端开发、鸿蒙开发、物联网、嵌入式、云原生、开源等领域有深厚造诣。图书作者:《ESP32-C3物联网工程开发实战》图书作者:《SwiftUI入门,进阶与实战》超级个体:CO
深度解析前端面试八股文:核心知识点与高效应对策略
赵大仁
前端 面试 职场和发展
深度解析前端面试八股文:核心知识点与高效应对策略1.引言前端面试是每位开发者迈向职业进阶的重要环节,涉及HTML、CSS、JavaScript、性能优化、浏览器原理、网络、安全、框架(Vue/React)等核心知识点。本文不仅会覆盖前端面试的高频八股文,还会结合生动的案例,让你在面试时能够脱离死记硬背,从理解中突破!2.HTML&CSS高频考点2.1HTML语义化问题:什么是HTML语义化?为什么
【DevOps】Backstage介绍及如何在Azure Kubernetes Service上进行部署
小涵
Azure云企业实践分享 devops azure kubernetes 容器 docker backstage
【DevOps】Backstage介绍及如何在AzureKubernetesService上进行部署推荐超级课程:本地离线DeepSeekAI方案部署实战教程【完全版】Docker快速入门到精通Kubernetes入门到大师通关课AWS云服务快速入门实战目录【DevOps】Backstage介绍及如何在AzureKubernetesService上进行部署Backstage介绍在AKS上部署Bac
java责任链模式
3213213333332132
java 责任链模式 村民告县长
责任链模式,通常就是一个请求从最低级开始往上层层的请求,当在某一层满足条件时,请求将被处理,当请求到最高层仍未满足时,则请求不会被处理。
就是一个请求在这个链条的责任范围内,会被相应的处理,如果超出链条的责任范围外,请求不会被相应的处理。
下面代码模拟这样的效果:
创建一个政府抽象类,方便所有的具体政府部门继承它。
package 责任链模式;
/**
*
linux、mysql、nginx、tomcat 性能参数优化
ronin47
一、linux 系统内核参数
/etc/sysctl.conf文件常用参数 net.core.netdev_max_backlog = 32768 #允许送到队列的数据包的最大数目
net.core.rmem_max = 8388608 #SOCKET读缓存区大小
net.core.wmem_max = 8388608 #SOCKET写缓存区大
php命令行界面
dcj3sjt126com
PHP cli
常用选项
php -v
php -i PHP安装的有关信息
php -h 访问帮助文件
php -m 列出编译到当前PHP安装的所有模块
执行一段代码
php -r 'echo "hello, world!";'
php -r 'echo "Hello, World!\n";'
php -r '$ts = filemtime("
Filter&Session
171815164
session
Filter
HttpServletRequest requ = (HttpServletRequest) req;
HttpSession session = requ.getSession();
if (session.getAttribute("admin") == null) {
PrintWriter out = res.ge
连接池与Spring,Hibernate结合
g21121
Hibernate
前几篇关于Java连接池的介绍都是基于Java应用的,而我们常用的场景是与Spring和ORM框架结合,下面就利用实例学习一下这方面的配置。
1.下载相关内容: &nb
[简单]mybatis判断数字类型
53873039oycg
mybatis
昨天同事反馈mybatis保存不了int类型的属性,一直报错,错误信息如下:
Caused by: java.lang.NumberFormatException: For input string: "null"
at sun.mis
项目启动时或者启动后ava.lang.OutOfMemoryError: PermGen space
程序员是怎么炼成的
eclipse jvm tomcat catalina.sh eclipse.ini
在启动比较大的项目时,因为存在大量的jsp页面,所以在编译的时候会生成很多的.class文件,.class文件是都会被加载到jvm的方法区中,如果要加载的class文件很多,就会出现方法区溢出异常 java.lang.OutOfMemoryError: PermGen space.
解决办法是点击eclipse里的tomcat,在
我的crm小结
aijuans
crm
各种原因吧,crm今天才完了。主要是接触了几个新技术:
Struts2、poi、ibatis这几个都是以前的项目中用过的。
Jsf、tapestry是这次新接触的,都是界面层的框架,用起来也不难。思路和struts不太一样,传说比较简单方便。不过个人感觉还是struts用着顺手啊,当然springmvc也很顺手,不知道是因为习惯还是什么。jsf和tapestry应用的时候需要知道他们的标签、主
spring里配置使用hibernate的二级缓存几步
antonyup_2006
java spring Hibernate xml cache
.在spring的配置文件中 applicationContent.xml,hibernate部分加入
xml 代码
<prop key="hibernate.cache.provider_class">org.hibernate.cache.EhCacheProvider</prop>
<prop key="hi
JAVA基础面试题
百合不是茶
抽象实现接口 String类 接口继承 抽象类继承实体类 自定义异常
/* * 栈(stack):主要保存基本类型(或者叫内置类型)(char、byte、short、 *int、long、 float、double、boolean)和对象的引用,数据可以共享,速度仅次于 * 寄存器(register),快于堆。堆(heap):用于存储对象。 */ &
让sqlmap文件 "继承" 起来
bijian1013
java ibatis sqlmap
多个项目中使用ibatis , 和数据库表对应的 sqlmap文件(增删改查等基本语句),dao, pojo 都是由工具自动生成的, 现在将这些自动生成的文件放在一个单独的工程中,其它项目工程中通过jar包来引用 ,并通过"继承"为基础的sqlmap文件,dao,pojo 添加新的方法来满足项
精通Oracle10编程SQL(13)开发触发器
bijian1013
oracle 数据库 plsql
/*
*开发触发器
*/
--得到日期是周几
select to_char(sysdate+4,'DY','nls_date_language=AMERICAN') from dual;
select to_char(sysdate,'DY','nls_date_language=AMERICAN') from dual;
--建立BEFORE语句触发器
CREATE O
【EhCache三】EhCache查询
bit1129
ehcache
本文介绍EhCache查询缓存中数据,EhCache提供了类似Hibernate的查询API,可以按照给定的条件进行查询。
要对EhCache进行查询,需要在ehcache.xml中设定要查询的属性
数据准备
@Before
public void setUp() {
//加载EhCache配置文件
Inpu
CXF框架入门实例
白糖_
spring Web 框架 webservice servlet
CXF是apache旗下的开源框架,由Celtix + XFire这两门经典的框架合成,是一套非常流行的web service框架。
它提供了JAX-WS的全面支持,并且可以根据实际项目的需要,采用代码优先(Code First)或者 WSDL 优先(WSDL First)来轻松地实现 Web Services 的发布和使用,同时它能与spring进行完美结合。
在apache cxf官网提供
angular.equals
boyitech
AngularJS AngularJS API AnguarJS 中文API angular.equals
angular.equals
描述:
比较两个值或者两个对象是不是 相等。还支持值的类型,正则表达式和数组的比较。 两个值或对象被认为是 相等的前提条件是以下的情况至少能满足一项:
两个值或者对象能通过=== (恒等) 的比较
两个值或者对象是同样类型,并且他们的属性都能通过angular
java-腾讯暑期实习生-输入一个数组A[1,2,...n],求输入B,使得数组B中的第i个数字B[i]=A[0]*A[1]*...*A[i-1]*A[i+1]
bylijinnan
java
这道题的具体思路请参看 何海涛的微博:http://weibo.com/zhedahht
import java.math.BigInteger;
import java.util.Arrays;
public class CreateBFromATencent {
/**
* 题目:输入一个数组A[1,2,...n],求输入B,使得数组B中的第i个数字B[i]=A
FastDFS 的安装和配置 修订版
Chen.H
linux fastDFS 分布式文件系统
FastDFS Home:http://code.google.com/p/fastdfs/
1. 安装
http://code.google.com/p/fastdfs/wiki/Setup http://hi.baidu.com/leolance/blog/item/3c273327978ae55f93580703.html
安装libevent (对libevent的版本要求为1.4.
[强人工智能]拓扑扫描与自适应构造器
comsci
人工智能
当我们面对一个有限拓扑网络的时候,在对已知的拓扑结构进行分析之后,发现在连通点之后,还存在若干个子网络,且这些网络的结构是未知的,数据库中并未存在这些网络的拓扑结构数据....这个时候,我们该怎么办呢?
那么,现在我们必须设计新的模块和代码包来处理上面的问题
oracle merge into的用法
daizj
oracle sql merget into
Oracle中merge into的使用
http://blog.csdn.net/yuzhic/article/details/1896878
http://blog.csdn.net/macle2010/article/details/5980965
该命令使用一条语句从一个或者多个数据源中完成对表的更新和插入数据. ORACLE 9i 中,使用此命令必须同时指定UPDATE 和INSE
不适合使用Hadoop的场景
datamachine
hadoop
转自:http://dev.yesky.com/296/35381296.shtml。
Hadoop通常被认定是能够帮助你解决所有问题的唯一方案。 当人们提到“大数据”或是“数据分析”等相关问题的时候,会听到脱口而出的回答:Hadoop! 实际上Hadoop被设计和建造出来,是用来解决一系列特定问题的。对某些问题来说,Hadoop至多算是一个不好的选择,对另一些问题来说,选择Ha
YII findAll的用法
dcj3sjt126com
yii
看文档比较糊涂,其实挺简单的:
$predictions=Prediction::model()->findAll("uid=:uid",array(":uid"=>10));
第一个参数是选择条件:”uid=10″。其中:uid是一个占位符,在后面的array(“:uid”=>10)对齐进行了赋值;
更完善的查询需要
vim 常用 NERDTree 快捷键
dcj3sjt126com
vim
下面给大家整理了一些vim NERDTree的常用快捷键了,这里几乎包括了所有的快捷键了,希望文章对各位会带来帮助。
切换工作台和目录
ctrl + w + h 光标 focus 左侧树形目录ctrl + w + l 光标 focus 右侧文件显示窗口ctrl + w + w 光标自动在左右侧窗口切换ctrl + w + r 移动当前窗口的布局位置
o 在已有窗口中打开文件、目录或书签,并跳
Java把目录下的文件打印出来
蕃薯耀
列出目录下的文件 文件夹下面的文件 目录下的文件
Java把目录下的文件打印出来
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
蕃薯耀 2015年7月11日 11:02:
linux远程桌面----VNCServer与rdesktop
hanqunfeng
Desktop
windows远程桌面到linux,需要在linux上安装vncserver,并开启vnc服务,同时需要在windows下使用vnc-viewer访问Linux。vncserver同时支持linux远程桌面到linux。
linux远程桌面到windows,需要在linux上安装rdesktop,同时开启windows的远程桌面访问。
下面分别介绍,以windo
guava中的join和split功能
jackyrong
java
guava库中,包含了很好的join和split的功能,例子如下:
1) 将LIST转换为使用字符串连接的字符串
List<String> names = Lists.newArrayList("John", "Jane", "Adam", "Tom");
Web开发技术十年发展历程
lampcy
android Web 浏览器 html5
回顾web开发技术这十年发展历程:
Ajax
03年的时候我上六年级,那时候网吧刚在小县城的角落萌生。传奇,大话西游第一代网游一时风靡。我抱着试一试的心态给了网吧老板两块钱想申请个号玩玩,然后接下来的一个小时我一直在,注,册,账,号。
彼时网吧用的512k的带宽,注册的时候,填了一堆信息,提交,页面跳转,嘣,”您填写的信息有误,请重填”。然后跳转回注册页面,以此循环。我现在时常想,如果当时a
架构师之mima-----------------mina的非NIO控制IOBuffer(说得比较好)
nannan408
buffer
1.前言。
如题。
2.代码。
IoService
IoService是一个接口,有两种实现:IoAcceptor和IoConnector;其中IoAcceptor是针对Server端的实现,IoConnector是针对Client端的实现;IoService的职责包括:
1、监听器管理
2、IoHandler
3、IoSession
ORA-00054:resource busy and acquire with NOWAIT specified
Everyday都不同
oracle session Lock
[Oracle]
今天对一个数据量很大的表进行操作时,出现如题所示的异常。此时表明数据库的事务处于“忙”的状态,而且被lock了,所以必须先关闭占用的session。
step1,查看被lock的session:
select t2.username, t2.sid, t2.serial#, t2.logon_time
from v$locked_obj
javascript学习笔记
tntxia
JavaScript
javascript里面有6种基本类型的值:number、string、boolean、object、function和undefined。number:就是数字值,包括整数、小数、NaN、正负无穷。string:字符串类型、单双引号引起来的内容。boolean:true、false object:表示所有的javascript对象,不用多说function:我们熟悉的方法,也就是
Java enum的用法详解
xieke90
enum 枚举
Java中枚举实现的分析:
示例:
public static enum SEVERITY{
INFO,WARN,ERROR
}
enum很像特殊的class,实际上enum声明定义的类型就是一个类。 而这些类都是类库中Enum类的子类 (java.l