随笔分类 - html/css
摘要:css可以通过word-break与white-space这两个属性来设置自动换行。word-wrap属性允许长单词或URL地址换行到下一行。white-space属性可以设置文本换行方式。 css使容器放不下自动换行: css代码: <style type="text/css"> .linebr
阅读全文
摘要:每次新开发网站或新网页时候我们都需要初始化css样式的属性,这是为什么?下面本篇文章就来给大家介绍一下初始化css的原因,以及方法,希望对大家有所帮助。 初始化CSS的原因 1、浏览器差异 因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示
阅读全文
摘要:介绍: css3 的Flex弹性盒的布局是一个用于页面布局的全新css3模块功能。它可以把列表放在同一个方向(从左到右或从上到下排列),并且让这些列表能延伸到占用可用的空间。较为复杂的布局可以通过嵌套一个伸缩容器(flex container)来辅助实现。 Flexbox可以简单快速的创建一个具有弹
阅读全文
摘要:属性选择器非常神奇。它们可以使你摆脱棘手的问题,帮助你避免添加类,并指出代码中的一些问题。但是不要担心,虽然属性选择器非常复杂和强大,但是它们很容易学习和使用。在本文中,我们将讨论它们是如何运行的,并给出一些如何使用它们的想法。 通常将 html 属性放在方括号中,称为属性选择器,如下: [href
阅读全文
摘要:对于前端来说,涉及的知识面广,内容繁多,但是万变不离其宗,主要也就是围绕着html(5),css(less,scss,sass,styus,css3),js(es5,es6),以及常见的几大热门框架vue,react等,话不多说,直接开始进入主题。 1.请说出几个html5新特性 答:html5增加
阅读全文
摘要:按钮是UI/UX最关键的组件之一,在不同设备及平台上得到了广泛的应用。它们具有影响用户行为和体验的能力。假如按钮设计不合理,会令用户产生误解及障碍。按钮设计的目的是引导用户完成我们在交互系统中预置的用户流程得以完成,但糟糕的按钮设计则可能会是你丢失你的用户。那么,现在是时候来研究该如何设计你的按钮了
阅读全文
摘要:可以在需要换行的元素内,将word-wrap属性的值设置为break-word来设置文字自动换行。。下面本篇文章就来给大家介绍一下word-wrap属性,希望对大家有所帮助。 word-wrap属性设置或检索当内容超出其容器边界时是否中断单词,可用于将长单词或 URL 地址在容器的边界处进行自动换行
阅读全文
摘要:在css中可以使用text-decoration属性或border-bottom属性来给文字添加下划线样式。下面本篇文章就来给大家介绍一下,希望对大家有所帮助。 方法1:使用text-decoration属性设置 css的text-decoration属性用于指定添加到文本的修饰,其underlin
阅读全文
摘要:html注释:不被程序执行的代码。用于程序员标记代码,在后期的修改,以及他人的学习时有所帮助。对关键代码的注释是一个良好的习惯。在开发网站或者功能模块开发时,代码的注释尤其重要。 html注释: <!--...--> 注释标签用来在源文档中插入注释,注释不会在浏览器中显示。 我们经常要在一些代码旁做
阅读全文
摘要:css怎么设置文字强制不换行?本篇文章就给大家介绍css设置文字(特别是连续的数字和英文)强制不换行的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。 下面我们通过简单的代码示例给大家介绍css设置文字的强制不换行,且超出部分隐藏的方法 html代码: <div> <p>Thi
阅读全文
摘要:网页标签即html标签是网页浏览器识别符,是浏览器程序默认系统默认许可标签。html标签是HTML语言中最基本的单位,HTML标签是HTML(标准通用标记语言下的一个应用)最重要的组成部分。 超文本标记语言(外国语简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单
阅读全文
摘要:用div+css进行网站布局时,做一些浮动层等特殊特殊效果时要考虑到定位问题;这就要用到Position属性。 Position属性有四个值:static、fixed、absolute和relative。 后面两个值在布局中的定位里是经常用到的,顾名思义: ● absolute是指绝对定位 即将对象
阅读全文
摘要:很多小伙伴都知道html5这个概念,但是具体不知道是做什么的,今天我们就来给大家普及一下html5和web前端的关系和区别。 什么是HTML5? HTML5其实是一种技术的集合,它包括了HTML5,css3,js等技术。而Web前端则是一种职业,国内从2005年开始发展的,是由网页设计师演变过来的。
阅读全文
摘要:前言 css 里面的伪元素其实是非常好用的,但是经常容易被大家忽略,伪元素里面常用到的 content 属性,可能现在很多人仅仅以为 content 属性的值只支持字符串,除了字符串外常用到的还有 uri、counter ,今天所要介绍的就是 conter(计数器)。 先看如下的例子: <div>
阅读全文
摘要:为什么要构建可伸缩的Web应用? 想象一下,你的营销活动吸引了很多用户,在某个时候,应用必须同时为成千上万的用户提供服务,这么大的并发量,服务器的负载会很大,如果设计不当,系统将无法处理。 接下来发生的就是,随机错误、缓慢的内容加载、无休止的等待、连接断开、服务不可用等问题。 辛辛苦苦吸引来的用户变
阅读全文
摘要:pointer-events css 属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target。 /* Keyword values */ pointer-events: auto; pointer-events: none; pointer-events: visibl
阅读全文
摘要:前言 项目启动时 css 应该注意哪些问题 文件名规范 文件名建议用小写字母加中横线的方式。为什么呢?因为这样可读性比较强,看起来比较清爽,像链接也是用这样的方式,例如 // 地址: github的地址 https://github.com/wangjeaf/ckstyle-node 那为什么变量名
阅读全文
摘要:具体用法 使用 -- 声明变量,使用 var() 函数获取变量。 :root{ --header-height: 70px; } body { --color: white; } .header { height: var(--header-height); } var() 函数还可以使用第二个参数
阅读全文
摘要:1: readonly规定输入字段为只读可复制,但是,用户可以使用Tab键切换到该字段,可选择,可以接收焦点,还可以选中或拷贝其文本。 <input type="text" value="哈哈哈" readonly="readonly"> 2:disabled 被禁用的 input 元素可复制,不能
阅读全文
摘要:自适应的椭圆 1.自适应的椭圆 实现方式是通过border-radius这个属性;border-radius它可以单独指定水平和垂直半径。用 / 分隔这两个值。并且该属性的值不仅可以接受长度值,还能接收百分比的值。百分比的值会基于元素的尺寸进行解析,宽是水平半径的解析,高是垂直半径的解析。 所以可以
阅读全文

浙公网安备 33010602011771号