文章目录
- 一、html
-
- 1. 如何理解html语义化
- 2. 说说块级元素和内联元素的区别
- 二、css
-
- 1. 盒模型的宽度offsetWidth如何计算
- 2. box-sizing:border-box有什么用
- 3. margin的纵向重叠问题
- 4. 谈谈你对BFC的理解和应用
- 5. 清除浮动有哪些方式
- 6. 使用flex布局实现骰子3
- 7.position的absolute和relative定位问题
- 8. 水平居中的实现方式
- 9.水平垂直居中的实现方式
- 10. line-height继承问题
- 11. rem,em,px
- 12. vw和vh
一、html
1. 如何理解html语义化
HTML语义化是指在编写HTML代码时,使用适当的标签来描述内容的含义和结构。
语义化的好处包括:
- 增强代码的可读性;
- 提高搜索引擎的理解能力;
- 方便开发者阅读和维护代码;
- 以及更好地支持无障碍访问等。
理解HTML语义化的关键在于正确使用HTML标签来表示内容的含义。以下是一些常见的HTML标签和它们的语义含义:
-
标签用于表示页面或区块的头部,比如页面的标题或导航栏。
-
标签用于表示导航栏。
-
标签用于表示页面的主要内容。
-
标签用于表示独立的文章内容。
-
标签用于表示页面或文章的分段内容。
-
标签用于表示与主要内容相关但不属于主要内容的附加信息。
-
标签用于表示页面或区块的底部,比如版权信息或联系方式。
-
–
标签用于表示标题,其中
表示最高级别的标题。
-
标签用于表示段落。
-
和
标签用于表示无序列表和有序列表。
-
- 标签用于表示列表中的每一项。
-
标签用于表示链接。
-
标签用于表示图片。
-
标签用于表示表格。
举例对比说明,假设有一个网页包含一个标题、一段文字内容和两张图片:
- 非语义化的HTML代码:
div class="header">网页标题div> div class="content">这是内容div> div class="image">img src="image1.jpg" alt="图片1">div> div class="image">img src="image2.jpg" alt="图片2">div>
这段代码使用了一些无具体含义的
标签来表示页面的结构。这样的代码在没有样式的情况下很难理解页面结构,也不利于搜索引擎对页面内容的分析。- 语义化的HTML代码:
header>网页标题header> main> article> h1>文章标题h1> p>这是内容p> article> figure> img src="image1.jpg" alt="图片1"> figcaption>图片1的描述figcaption> figure> figure> img src="image2.jpg" alt="图片2"> figcaption>图片2的描述figcaption> figure> main>
这段代码使用了具有明确含义的HTML标签来描述页面结构和内容。
表示网页的标题,
表示主要内容,
表示一篇文章等等。这样的代码清晰易读,有助于理解网页结构和内容。
通过对比可以看出,语义化的HTML代码更直观、易理解,也更便于网页的维护和SEO优化。
2. 说说块级元素和内联元素的区别
在HTML中,块级元素和内联元素是两种不同的元素类型。
块级元素(
Block-level elements
):- 块级元素通常会在页面中生成一个独立的块,占据一行或者多行的空间。
- 常见的块级元素有,
-
,
等。
内联元素(
Inline elements
):- 内联元素不会在页面中生成一个独立的块,而是与其他元素在一行显示。
- 常见的内联元素有
,
,
,
,
,
,
等。
块级元素和内联元素的区别主要体现在以下几个方面:
- 显示方式:块级元素以块的形式显示,即自动换行且占据一整行或多行的宽度;内联元素则与其他元素在一行上显示,不会换行。
- 盒模型:块级元素可以设置宽度、高度、内外边距等样式属性,可以直接控制元素的盒模型;内联元素的宽度和高度由其内容决定,不能直接设置。
-
默认样式:块级元素的默认样式是
display: block;
,而内联元素的默认样式是display: inline;
。 - 嵌套规则:块级元素可以包含其他块级元素和内联元素;内联元素不能包含块级元素,只能包含其他内联元素或者文本内容。
需要注意的是,可以通过CSS的属性
display
来改变元素的显示方式,将块级元素设置为内联元素或将内联元素设置为块级元素。二、css
1. 盒模型的宽度offsetWidth如何计算
盒模型的宽度
offsetWidth
是指一个元素的整体宽度,包括内容区域的宽度(content
)、内边距(padding
)以及边框(border
)。在计算
offsetWidth
时,浏览器会将元素的内容区域宽度、内边距宽度和边框宽度都考虑在内。
举例说明:假设有一个 div 元素,设置了如下样式:
div { width: 300px; padding: 10px; border: 1px solid black; }
这个 div 元素的盒模型宽度可以这样计算:
-
内容宽度:指定的宽度为 300px。
-
内边距和边框宽度:左右两侧的内边距为 10px,上下两侧的内边距为 10px;四条边的边框宽度为 1px。
因此,盒模型的总宽度为
300px + 2 * 10px + 2 * 1px = 322px
。2. box-sizing:border-box有什么用
"
box-sizing: border-box;
"是一个用于 CSS 的属性,它指定了元素的盒子模型计算方式,并将CSS的宽度(width
)和高度(height
)的计算方式修改为包括边框(border
)和内边距(padding
)的计算。举例来说,如果一个元素宽度被设置为200px并且应用了一些边框和内边距,如果没有使用"
box-sizing: border-box
;"属性,那么元素的实际宽度将会变大,以包括边框和内边距的大小。而如果使用了"box-sizing: border-box
;"属性,元素的实际宽度将会保持为200px,并且边框和内边距将会减少自动适应。下面是一个示例,展示了使用和不使用"box-sizing: border-box;"属性的区别:
HTML:
div class="example">div>
CSS:
.example { width: 200px; height: 100px; padding: 10px; border: 5px solid black; background-color: lightgray; box-sizing: border-box; }
在上述例子中,使用了"
box-sizing: border-box;
“属性,因此元素的实际宽度仍然为200px
,包括边框和内边距。如果没有使用该属性,元素的实际宽度将会变为230px(宽度 + 左右边距 + 左右边框),因为默认的"box-sizing
"属性值是"content-box
”,即只包括内容。这个属性特别有用的一个场景是当需要制作一个带有固定宽度的网格系统时,可以使用该属性确保每列总宽度都是固定的,而不会因为边框和内边距的存在而超出指定的宽度范围。
3. margin的纵向重叠问题
纵向重叠问题是指当相邻的元素都设置了上下边距(margin),并且上一个元素的下边距与下一个元素的上边距之和超过了一定的阈值(常为负数),则两者之间的垂直间距会取两个边距值中的较大者。
举一个具体的例子,假设有两个相邻的块级元素,分别是div1和div2,它们的CSS样式如下:
div1 { margin-bottom: 20px; } div2 { margin-top: 30px; }
在正常情况下,div1和div2之间的垂直间距应该是20px+30px=50px。然而,因为它们的边距之和超过了一定的阈值,实际渲染结果会取两个边距值中的较大者,即30px,所以div1和div2之间的垂直间距为30px。
这种纵向重叠问题通常出现在嵌套的块级元素中,比如一个列表中的每个列表项(li)都设置了上下边距,而整个列表外又设置了上下边距。当边距值的和超过了阈值时,列表项之间会出现较大的垂直间距,而不是累加所有边距值的和。为了避免这个问题,可以使用其他的方式来实现元素之间的间距,如padding、border等。
4. 谈谈你对BFC的理解和应用
BFC
是块格式化上下文(Block Formatting Context
)的缩写,BFC
可以看作是一个封闭的容器,容器内的元素布局不会影响到容器外的元素。形成bfc的条件
条件 描述 根元素 根元素(html)默认就是一个 bfc 浮动元素 浮动元素(float不为none) 绝对定位元素 绝对定位元素(position为absolute和fixed) display为inline-block、table-cell等 display为inline-block、table-cell等 overflow不为visible overflow不为visible的块级元素 常见的bfc应用场景:
-
清除浮动:当容器内部有浮动元素时,容器的高度会塌陷,不会撑开容器。我们可以通过创建一个BFC来清除浮动,使得容器能够正常显示高度。可以通过给容器设置
overflow: hidden
或者display: table
来创建BFC。 -
防止外边距合并:在正常流布局中,相邻的块级元素的垂直外边距会发生合并,导致元素之间的间距变大。但是在BFC中,相邻块级元素的垂直外边距不会合并。可以通过给元素创建BFC来防止外边距合并,可以通过设置
float
、position: absolute
、overflow: hidden
等属性来创建BFC。 -
实现多列布局:BFC可以实现多列布局,通过给容器设置
column-count
或者column-width
属性,可以将容器内的内容按照多列进行布局。由于每一列都处于独立的BFC中,因此列与列之间的布局互不影响。
5. 清除浮动有哪些方式
清除浮动的方式有以下几种:
-
使用clearfix
需要在浮动元素的父元素中添加clearfix类,然后通过该类设置clear:both属性来清除浮动。示例代码如下:
div class="clearfix"> div class="float-left">左浮动元素div> div class="float-right">右浮动元素div> div>
.clearfix::after { content: ""; display: table; clear: both; } .float-left { float: left; } .float-right { float: right; }
-
使用空元素添加clear属性
在浮动元素的父元素中添加一个空元素,然后使用clear属性来清除浮动。示例代码如下:
div class="clear-float"> div class="float-left">左浮动元素div> div class="float-right">右浮动元素div> div style="clear: both;">div> div>
-
使用overflow:hidden
在浮动元素的父元素中设置overflow属性为hidden,可以使父元素自动包含浮动子元素,从而清除浮动。示例代码如下:
div class="float-parent"> div class="float-left">左浮动元素div> div class="float-right">右浮动元素div> div>
.float-parent { overflow: hidden; } .float-left { float: left; } .float-right { float: right; }
6. 使用flex布局实现骰子3
效果如下:
示例代码:
DOCTYPE html> html lang="en"> head> meta charset="UTF-8" /> meta name="viewport" content="width=device-width, initial-scale=1.0" /> title>骰子三点布局title> style> .dice { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; border: 1px solid #000; } .dot { width: 10px; height: 10px; background-color: #000; border-radius: 50%; margin: 2px; } .dot:nth-child(1) { align-self: flex-start; } .dot:nth-child(3) { align-self: flex-end; } style> head> body> div class="dice"> span class="dot">span> span class="dot">span> span class="dot">span> div> body> html>
主要考察的是交叉轴的align-self属性。
7.position的absolute和relative定位问题
position:absolute
使元素的位置相对于其最近的已定位的祖先元素进行定位。如果没有已定位的祖先元素,则相对于最初的包含块(通常是浏览器窗口)进行定位。使用position:absolute时,可以使用top、bottom、left和right属性来指定元素相对于其定位父元素的偏移位置。绝对定位的元素会完全从正常的文档流中脱离,并且不保留其空间position:relative
则使元素相对于正常文档流进行定位。在使用position:relative时,可以使用top、bottom、left和right属性来指定元素相对于其原始位置的偏移。相对定位不会从元素在正常文档流中的位置中删除元素。相对定位的元素仍然占据其原始的空间,因此周围的元素不会发生布局变化为什么常用“子绝父相”进行定位布局?
"子绝父相"是指子元素使用position:absolute进行定位,父元素使用position:relative进行定位的布局方式。这种方式常用于构建复杂的页面布局,具有一些优点:
- 父元素的position:relative会创建一个新的定位上下文,使得子元素相对于其定位,而不会影响其他元素的布局。
- 子元素的position:absolute允许完全自由的定位。可以通过指定top、bottom、left和right属性来控制子元素在父元素中的精确位置。
- 可以方便地创建重叠和层叠效果,使得布局更加灵活。
举个例子,假设我们有以下HTML代码:
div class="parent"> div class="child">div> div>
CSS代码如下:
.parent { position: relative; height: 200px; width: 200px; background-color: lightblue; } .child { position: absolute; top: 50px; left: 50px; height: 50px; width: 50px; background-color: red; }
在这个例子中,父元素(class=“parent”)被设置为position:relative,这意味着子元素(class=“child”)将相对于父元素进行定位。子元素使用position:absolute进行定位,并且设置top和left属性使其与父元素的左上角偏移50像素。
8. 水平居中的实现方式
- 使用text-align属性:可以在父元素上设置text-align属性为"center",将其子元素水平居中对齐。
.parent { text-align: center; } .child { display: inline-block; }
-
使用margin属性:通过设置子元素的左右
margin
值为"auto
",可以将其水平居中对齐。
.parent { width: 300px; } .child { margin-left: auto; margin-right: auto; }
- 使用flexbox布局:使用flexbox布局可以轻松实现水平居中对齐。
.parent { display: flex; justify-content: center; } .child { /* no additional styling needed */ }
- 使用grid布局:通过将子元素放置在父元素的中心单元格中,可以实现水平居中对齐。
.parent { display: grid; place-items: center; } .child { /* no additional styling needed */ }
- 使用绝对定位与transform属性:通过将子元素的左右偏移设置为50%并且使用transform属性的
translateX(-50%)
将其平移回来可以实现水平居中对齐。
.parent { position: relative; } .child { position: absolute; left: 50%; transform: translateX(-50%); }
9.水平垂直居中的实现方式
-
使用绝对定位和transform属性:
将父容器设置为相对定位,然后将子容器设置为绝对定位,通过设置left和top为50%,再使用transform属性将内容向左和向上平移50%的宽度和高度,从而实现水平垂直居中对齐。
-
使用Flexbox布局:
将父容器设置为Flex布局,并使用
justify-content: center;
和align-items: center;
属性使内容在水平和垂直方向上都居中对齐。 -
设置容器的
text-align
属性为center
,使文本在容器中水平居中
根据目标元素的高度,调整line-height
的值,使得目标元素在容器中垂直居中
DOCTYPE html> html lang="en"> head> meta charset="UTF-8" /> meta name="viewport" content="width=device-width, initial-scale=1.0" /> title>垂直居中title> style> .container { height: 200px; line-height: 200px; text-align: center; border: 1px solid black; } .target { border: 1px solid red; display: inline-block; line-height: normal; vertical-align: middle; } style> head> body> div class="container"> div class="target">居中文本div> div> body> html>
-
绝对定位加margin:auto实现
可以使用绝对定位和margin:auto来实现水平垂直居中,可以按照以下步骤进行操作:
- 父元素需要设置
position: relative
,用于作为相对定位的基准。 - 子元素需要设置
position: absolute
,以便于进行绝对定位。 - 子元素设置
top: 0
,left: 0
,bottom: 0
,right: 0
,这样可以将子元素拉伸至父元素的边界。 - 子元素设置
margin: auto
,让子元素在父元素中居中。
效果如下:
示例代码如下:DOCTYPE html> html lang="en"> head> meta charset="UTF-8" /> meta name="viewport" content="width=device-width, initial-scale=1.0" /> title>margin:auto居中title> style> .parent { position: relative; width: 600px; height: 500px; background-color: lightgray; } .child { position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; width: 200px; height: 100px; background-color: white; } style> head> body> div class="parent"> div class="child">垂直水平居中div> div> body> html>
10. line-height继承问题
1.当父元素的line-height属性设置为具体像素值50px时,子元素会继承父元素的line-height属性值。无论子元素的font-size属性值是多少,它的行高将始终是50px。
例如,假设父元素的line-height设置为50px,子元素的font-size设置为20px,那么子元素的行高也将是50px。
div class="parent"> p class="child">Lorem ipsum dolor sit amet, consectetur adipiscing elit.p> div>
CSS样式如下:
.parent { line-height: 50px; } .child { font-size: 20px; }
2.当父元素的line-height属性设置为数值3时,子元素会继承该比例。具体取决于子元素的font-size属性值。
假设父元素的line-height属性值为3,子元素的font-size属性值为16px。那么子元素的行高计算如下:
- 子元素的行高计算公式是:line-height = 父元素的line-height * 子元素的font-size。
- 父元素的line-height属性值是3,子元素的font-size属性值是16px,所以子元素的行高计算公式是:line-height = 3 * 16px。
- 子元素的行高计算结果是48px。
因此,子元素的行高为48px。这意味着子元素的文本内容将在每行之间保留48px的空白区域。
如下
div class="parent"> p class="child">这是子元素p> div>
CSS代码:
.parent { font-size: 20px; line-height: 3; } .child { font-size: 16px; }
3.当父元素的line-height属性设置为百分比200%时,子元素会继承父元素的line-height属性计算后的结果。具体取决于父元素的font-size属性值。
style> .parent { font-size: 20px; line-height: 200%; } .child { font-size: 16px; } style> div class="parent"> div class="child">子元素的文本内容。div> div>
在上述代码中,父元素的
line-height
属性值设置为200%(即2倍的字体大小),父元素的font-size
属性值为20px。子元素的font-size
属性值为16px。根据继承机制和计算规则:
- 父元素的
line-height
属性值会以父元素的font-size
属性值为基准进行计算。即父元素的line-height
计算结果为20px * 200% = 40px
。 - 子元素会继承父元素的计算后的
line-height
属性值。因此,子元素的line-height
属性值也为40px。
11. rem,em,px
在CSS中,rem、em和px都是用于指定元素大小的单位。
-
rem(根元素相对单位):rem单位是相对于根元素(即元素)的字体大小的单位。如果根元素的字体大小为16px,则1rem等于16px。rem单位的主要优势是能够根据根元素的字体大小进行自适应调整,适用于响应式设计。
-
em(相对父元素单位):em单位是相对于最近的父元素的字体大小的单位。如果父元素的字体大小为16px,则1em等于16px。em单位与rem单位不同之处在于,它是根据父元素的字体大小而不是根元素的字体大小进行计算的。因此,em单位也可以用于实现相对父元素的布局。
-
px(像素单位):px单位是像素单位,1px表示屏幕上的一个物理像素,不受其他因素影响。px单位是固定大小的单位,无法根据用户设置进行调整。由于设备显示的物理像素不同,使用px单位可能导致在不同设备上显示不一致的问题。
总结:
- rem单位根据根元素的字体大小进行调整,适用于响应式设计。
- em单位根据父元素的字体大小进行调整,适用于相对布局。
- px单位是固定的像素单位,不受其他因素影响,适用于精确布局。
12. vw和vh
在CSS中,vw(Viewport Width)和vh(Viewport Height)是相对于视口大小的单位。
- vw:1vw等于视口宽度的1%。例如,如果视口的宽度是1000px,那么1vw就等于10px。
- vh:1vh等于视口高度的1%。例如,如果视口的高度是800px,那么1vh就等于8px。
vw 和 vh 单位的用途是根据设备的视口大小(即浏览器窗口大小)来调整元素的尺寸。这对于创建响应式布局非常有用,可以使元素在不同设备和窗口尺寸下保持一致的比例。
例如,如果你希望一个元素的宽度占据视口宽度的 50%,你可以使用以下代码:
.element { width: 50vw; }
同样地,如果你希望一个元素的高度占据视口高度的 30%,你可以使用以下代码:
.element { height: 30vh; }
通过使用 vw 和 vh 单位,你可以创建具有自适应性质的布局,使得网页在不同大小的屏幕上都能良好地展示。
$(function() {
setTimeout(function () {
var mathcodeList = document.querySelectorAll('.htmledit_views img.mathcode');
if (mathcodeList.length > 0) {
for (let i = 0; i < mathcodeList.length; i++) {
if (mathcodeList[i].naturalWidth === 0 || mathcodeList[i].naturalHeight === 0) {
var alt = mathcodeList[i].alt;
alt = '\(' + alt + '\)';
var curSpan = $('');
curSpan.text(alt);
$(mathcodeList[i]).before(curSpan);
$(mathcodeList[i]).remove();
}
}
MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
}
}, 1000)
});
优惠劵
jieyucx
关注
关注-
13
点赞 -
踩 -
13
收藏
觉得还不错?
一键收藏
-
打赏 -
0
评论
专栏目录2020css/html和js的常见面试题汇总04-24主要是css/html和js的常见面试题汇总,附有答案,涉及知识点很全面,也可以自行去网上查找其他解析H5前端面试大全-包含大厂面试题_25个md文件分类面试题.rar10-3012.md BAT及互联网公司2014前端笔试面试题--HTML,CSS篇 HTML,CSS 13.md BAT及互联网公司2014前端笔试面试题--JavaScript篇 JavaScript 14.md 收集的前端面试题和答案 General 15.md 各大互联网公司2014前端笔试...参与评论
您还未登录,请先
登录
后发表或查看评论职来职往vue常见面试题及职场提升02-27Vue常见面试题: 挑选了几个一般难度的大家看看: 14、单页面应用和多页面应用区别及缺点 单页面应用(SPA),通俗的说就是指只有一个主页面的应用,浏览器一开始就加载所有的js、html、css。所有的页面内容都...前端面试大全、前端常见问题和原理总结、前端面试题、前端面试经验10-10前端面试 前端面试大全、前端常见问题和原理总结、前端面试题、前端面试经验JavaScript、Vue、Webpack、TypeScript、html、css、前端架构、前端算法、前端工程搭建、前端职场、React、技术选型、移动端适配、h5、...2020年最新web前端面试题04-262020年最新web前端面试题,包含html,css,javascript基础,web开发常见技术。element input 选中 但值未及时回显qq_41220477的博客12-18
417
这可能是因为 Vue 的渲染更新机制。Vue 使用异步更新队列,当你观察到数据变化时,Vue 将开启一个队列,并缓冲在同一事件循环中发生的所有数据改变。然后,在下一个的事件循环 “tick” 中,Vue 刷新队列并执行实际(已去重的)工作。在修改数据之后立即使用这个方法,获取更新后的 DOM。在你的情况下,当你选择分包合同的值时,可能是因为 Vue 还没有来得及更新 DOM,所以你看不到新的值。当你在其他输入框输入内容时,触发了 Vue 的更新机制,所以你可以看到分包合同的新值。vue前端 对象中判断某个数组为空,把他从对象中删除weixin_49826079的博客12-19
255
vue前端 对象中判断某个数组为空,把他从对象中删除前端基础South.return12-18
854
标签:dl 嵌套 dt 和 dd,dl 是定义列表,dt 是定义列表的标题,dd 是定义列表的描述 / 详情。js对象转换为excel,excel转换为js对象yang20000222的博客12-19
113
使用module.exports导出,require导入修改后缀为mjs,可使用importd导入 ,export default export导出(自用过一次,后面忘记怎么改的了)【Python基础】文件读写from__2023_11_28的博客12-19
716
【Python基础】文件读写学习使用js保留两位小数同时去掉小数末尾多余的00徊忆羽菲12-20
150
学习使用js保留两位小数同时去掉小数末尾多余的00深度解析DOM尺寸与位置:clientWidth、offsetWidth、scrollWidth、getBoundingClientRect() 一网打尽编码行者的博客12-20
136
获取元素内容区域的宽度,不包括边框和滚动条。:获取元素相对于其父元素的偏移宽度,包括边框、内边距和滚动条。:获取元素内容的总宽度,包括溢出的部分。:获取元素相对于视口的位置和大小信息。在实际应用中,根据具体的需求选择合适的属性或方法来获取元素的尺寸和位置信息,可以更灵活地处理 DOM 操作。CSS新手入门笔记整理:CSS3边框样式太空背包客的博客12-19
600
CSS3边框样式我们应该了解的前端缓存qq_42880714的博客12-19
147
我们应该了解的前端缓存Vue3-22-组件-插槽的使用详解northcastle的博客12-18
715
Vue3 中组件的插槽的使用前后端传参:掌握FormData并解决form-data类型传参问题qq_45796592的博客12-18
1048
掌握FormData并解决form-data类型传参问题Web ML 库的Transformers.js 提供文本转语音功能最新发布xiangzhihong8的专栏12-20
127
在最新的 2.7 版本中,Transformers.js 引入了增强功能,其中包括文本转语音(TTS)支持。按照设计,Transformers.js 在功能上等同于 Hugging Face 的 Python 库 transformers,也就是说,你可以使用非常近似的 API 运行相同的预训练模型。Transformers.js 提供了广泛的模型支持,包括 BERT、GPT-2、T5 和 Vision Transformer(ViT)等架构,确保用户可以针对特定的任务选择正确的模型。ssm基于java web的计算机office课程平台设计与实现论文weixin_112233的博客12-18
149
使用旧方法对课程进行系统化管理已经不再让人们信赖了,把现在的网络信息技术运用在课程的管理上面可以解决许多信息管理上面的难题,比如处理数据时间很长,数据存在错误不能及时纠正等问题。
这次开发的计算机office课程平台有管理员,教师,学生。管理员功能有个人中心,学生管理,教师管理,课程类型管理,课程信息管理,作业信息管理,作业提交管理,留言板管理,在线论坛,系统管理等。教师功能有有个人中心,课程信息管理,作业信息管理,作业提交管理,试卷管理,试题管理,考试管理等。学生功能有个人中心,作业提交管理,留言板管理,WebCamTexture报错sinat_34014668的博客12-18
316
使用WebCamTexture把相机的画面显示到 RawImage 上。这两个错是因为摄像头被占用,需要检查代码中其他调用摄像头的地方。执行 WebCamTexture.Play() 报下面的错误。前端面试html和css部分笔试题07-28当然,我可以帮你回答一些前端面试中关于HTML和CSS的笔试题。以下是一些常见的问题:1. 请解释一下HTML和CSS的作用。
HTML(超文本标记语言)用于创建网页的结构和内容,而CSS(层叠样式表)用于控制网页的样式和布局。2. 请描述一下HTML5的新特性。
HTML5引入了许多新的元素和API,例如``用于更好地组织内容等等。 3. 如何在HTML中插入图像?
可以使用``标签来插入图像。例如:``。其中,`src`属性指定图像的路径,`alt`属性用于提供图像的替代文本。4. 如何创建一个有序列表和无序列表?
有序列表使用`- `标签,无序列表使用`
- `标签。列表项使用`
- `标签。例如:
```html- 列表项 1
- 列表项 2
- 列表项 3
- 列表项 1
- 列表项 2
- 列表项 3
```
5. 请解释一下CSS选择器的概念。
CSS选择器用于选择要应用样式的HTML元素。常见的选择器包括标签选择器(例如`p`)、类选择器(例如`.class`)、ID选择器(例如`#id`)等等。这些是一些常见的HTML和CSS笔试题,希望能对你有所帮助!如需进一步了解,请随时询问。
“相关推荐”对你有帮助么?
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
window.csdn.csdnFooter.options = {
el: '.blog-footer-bottom',
type: 2
}- 291
- 原创
- 6万+
- 周排名
- 9319
- 总排名
- 36万+
- 访问
-
- 等级
- 3273
- 积分
- 161
- 粉丝
- 281
- 获赞
- 93
- 评论
- 741
- 收藏
私信关注(adsbygoogle = window.adsbygoogle || []).push({});
热门文章
-
vue3报错 Unexpected mutation of “xxx“ prop.(eslintvue/no-mutating-props)
8692 -
vue跳转外部链接的方法
8605 -
vue3 el-upload 上传附件及预览 限制只能上传一个图片或者pdf格式的文件
6765 -
vue3语法中使用vscode打开,满屏红线报错,解决方法
5990 -
vue3中的生命周期
5859
分类专栏
-
面试题
1篇
-
vue的那些事
44篇
-
菜鸟的踩坑之旅
服务器托管网52篇
-
工具网站
4篇
-
高德地图
8篇
-
常用的数据处理
6篇
-
react从入门到精通
10篇
-
vue3从入门到精通
33篇
-
three.js
27篇
-
前端常用布局和注意事项
14篇
-
uni-app
15篇
-
webpack
31篇
-
数据结构和算法
6篇
-
前端性能优化
6篇
-
node
22篇
-
vite
11篇
-
ts
13篇
-
js设计模式
1篇
-
arcgis for javascript
8篇
-
AI
3篇
-
百度地图
8篇
最新评论
您愿意向朋友推荐“博客详情页”吗?
-
强烈不推荐 -
不推荐 -
一般般 -
推荐 -
强烈推荐
提交
最新文章
- elementUI 框架中el-radio-group组件赋值之后,点击无效问题
- echarts案例网站
- 好看的css样式案例网站
202312月
2篇11月
9篇10月
17篇09月
13篇08月
16篇07月
52篇06月
85篇05月
15篇04月
16篇03月
26篇01月
11篇2022年29篇目录
$("a.flexible-btn").click(function(){
$(this).parents('div.aside-box').removeClass('flexible-box');
$(this).parents("p.text-center").remove();
}).wwads-img img {width: 150px; margin-top:10px}
目录
(window.slotbydup = window.slotbydup || []).push({
id: "u6940829",
container: "_nwikfgpvhh",
async: true
});分类专栏
-
面试题
1篇
-
vue的那些事
44篇
-
菜鸟的踩坑之旅
52篇
-
工具网站
4篇
-
高德地图
8篇
-
常用的数据处理
6篇
-
react从入门到精通
10篇
-
vue3从入门到精通
33篇
-
three.js
27篇
-
前端常用布局和注意事项
14篇
-
uni-app
15篇
-
webpack
31篇
-
数据结构和算法
6篇
-
前端性能优化
6篇
-
node
22篇
-
vite
11篇
-
ts
13篇
-
js设计模式
1篇
-
arcgis for javascript
8篇
-
AI
3篇
-
百度地图
8篇
目录
var timert = setInterval(function() {
sideToolbar = $(".csdn-side-toolbar");
if (sideToolbar.length > 0) {
sideToolbar.css('cssText', 'bottom:64px !important;')
clearInterval(timert);
}
}, 200);评论
被折叠的条评论
为什么被折叠?到【灌水乐园】发言
查看更多评论添加红包请填写红包祝福语或标题
个
红包个数最小为10个
元
红包金额最低5元
当前余额3.43元
前往充值 >需支付:10.00元
打赏作者
-
-
jieyucx
你的鼓励将是我创作的最大动力
1
2
4
6
10
20扫码支付:1
获取中
扫码支付您的余额不足,请更换扫码支付或充值
打赏作者
实付元使用余额支付
点击重新获取扫码支付钱包余额
0抵扣说明:
1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。余额充值
服务器托管,北京服务器托管,服务器租用 http://www.fwqtg.net
陆思礼上:
感谢,得到了帮助
文学而:
hook中的函数如何调用vue页面中定义的函数
m0_67674598:
vue2里面无法时时绑定,只能在项目发布完毕后绑定一次
yufenghaihai:
lighthouse开始前可以选设备类型 (手机、桌面),如果选择手机情况下,如何修改模拟的设备类型,当前试的默认设备是moto g,个人测试是很老的设备。
设备类型的选择对测试结果影响还是蛮大的
coderhhan:
这是webpack几?