Skip to content
    • info@hktsoft.net
  • Connecting and sharing with us
  • Login
  • About Us
    • info@hktsoft.net
HKT SOFTHKT SOFT
  • Home
  • Programming Languages
    • Popular Programming Languages
      • Core Java
      • JavaScript
      • Advanced Java
      • C
      • C#
      • C++
      • Python
      • PHP
      • HTML
      • CSS
    • Other Programming Languages
      • GitHub
      • Bootstrap
      • AngularJS
      • jQuery
      • MongoDB
      • NodeJS
      • Unix & Linux
    • Database
      • Basic Database
      • SQL
      • SQL Server
      • Data structures and algorithms
    • Website
      • WordPress
      • Joomla
      • Magento
      • Opencart
      • Haravan
  • Corporate Management
    • Entrepreneurship
      • Startup
      • Entrepreneurship
      • Management Science
    • Managing primary activities
      • Marketing
      • Sales management
      • Retail management
      • Import – Export
      • International business
      • E-commerce
      • Project management
      • Product Management
      • Quality Management
      • Logistics Management
      • Supply Chain Management
    • Managing support activities
      • Strategy
      • Human Resource Management
      • Organizational Culture
      • Information System
      • Corporate Finance
      • Stock Market
      • Accounting
      • Office Management
  • Scientific Theories
    • Economic Theories
    • Social Theories
    • Political Theories
    • Philosophies
    • Theology
    • Art Movements
CSS History – A Brief Overview

Before Cascading Style Sheets (CSS) there was very little that could be done to change the design of a web page. While Hyper Text Markup Language (HTML) creates documents for the World Wide Web, it was specifically designed to hold the content of a web page. Housed in a separate file, CSS adds the style and design [ ...] [ ...]

23
Dec
Types of Selectors in CSS

Selectors can be grouped into four basic types: simple, compound, combinator, and complex. Simple selectors are the oldest form of CSS selector, and may be the type used most often. Simple selectors specify a single condition for matching elements. The universal selector ( * ) is a simple selector. So are type (or element) selectors [ ...] [ ...]

23
Dec
Combinators in CSS

As we saw above, a combinator is a character sequence that expresses a relationship between the selectors on either side of it. Using a combinator creates a complex selector. Using complex selectors can, in some cases, be the most concise way to define styles. In the previous section, we listed the four combinators: descendant (via [ ...] [ ...]

23
Dec
Attribute Selectors in CSS

Introduced with the CSS Level 2 Specification, attribute selectors make it possible to style elements based on the presence of an attribute, such as [controls] for a media player, or [disabled] for a form field. You can also use attribute selectors to match elements based on the presence of an attribute and its value. For [ ...] [ ...]

23
Dec
Pseudo-classes and Pseudo-elements in CSS

Most of the new selectors added in CSS3 and CSS4 are not attribute selectors at all. They’re pseudo-classes and pseudo-elements. Though you’ve probably used pseudo-classes and pseudo-elements in your CSS, you may not have thought about what they are or how they differ from each other. Pseudo-classes let us style objects based on information-such as [ ...] [ ...]

23
Dec
Pseudo-elements in CSS: ::before and ::after

The CSS Pseudo-elements Module Level 4 specification clarifies behavior for existing pseudo-elements and defines several new ones. We’ll focus on the ones that currently have browser support: ::after inserts additional generated content after the content of an element : -.before inserts additional generated content before the content of an element ::first-Letter selects the first letter [ ...] [ ...]

23
Dec
Pseudo-elements in CSS: Creating Typographic Effects with ::first-letter

While the ::before and ::after pseudo-elements inject content, ::first-letter works with content that exists as part of the document source. With ::first-letter , we can create initial letter effects, such as drop caps, as you might see in a magazine or book layout. This CSS snippet adds an initial capital letter to every <p> element [ ...] [ ...]

23
Dec
Pseudo-elements in CSS: Creating Typographic Effects with ::first-line

The ::first-Line pseudo-element works similarly to ::first-Letter , but affects the entire first line of an element. For example, the first line of every paragraph could have larger text and a different color from the rest of the paragraph: p::first-line { font: bold 1.5em serif; font-style: italic; color: #673ab7; } You can see the result [ ...] [ ...]

23
Dec
Pseudo-elements in CSS: Custom List and Summary Icons with ::marker

::marker is a pseudo-element that represents a bullet or number indicator of elements with a display value of list-item . In most current browser versions, the default user-agent stylesheet applies display: list-item to <li> and <summary> elements. Any element with a list-item display value will generate a marker box that can be selected and styled [ ...] [ ...]

23
Dec
Pseudo-elements in CSS: Styling Input – placeholder Values

Text-based form inputs have a pLacehoLder attribute that lets us add a hint about what kind of data the field expects: <form> <p> <label for=”subscriber_email”>Your email address</label> <input type=”email” name=”subscriber_email” id=”subscriber_email” →placeholder=”yourname@example.com”> </p> </form> Most browsers display the value of the placeholder attribute within the form control as black text with a reduced opacity, as [ ...] [ ...]

23
Dec
Pseudo- classes in CSS: Highlighting Page Fragments with :target

A fragment identifier is the part of a URL starting with a # character-such as #top or #footnote1 . You may have used them to create in-page navigation links-sometimes called  “jump links”. With the :target pseudo-class, we can highlight the portion of the document that corresponds to that fragment. Say, for example, you have a [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Styling Elements That Have No Children Using :empty

Sometimes WYSIWYG (what you see is what you get) editors add empty <p> elements to your content. These empty elements may affect your document layout if your stylesheet also uses p as a type selector. It’s possible to visually exclude these elements, however, with the :empty pseudo-class: p:empty { display: none; } Earlier versions of [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Concise and Resilient Selectors with :is()

The :is() pseudo-class is one of three logical pseudo-classes available in CSS—the other two being :not() and :where() (which we’ll discuss in the next sections). You can use :is() to create more concise and resilient selectors. It’s a functional pseudo­class that accepts a selector list as its argument. Here’s an example: article :is( hi, h2, [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Negating Selectors with :not()

The :not() pseudo-class is the opposite of :is() . It returns all elements except for those that match the selector argument. For example, p:not(.message) matches every <p> element that doesn’t have a class of message . Here’s an example of a form that uses textual input types and radio buttons: form method=”post” action=”#”> <h1>Join the [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Adjusting Selector Specificity with :where()

The CSS Selectors Level 4 specification calls :where() the “specificity-adjustment pseudo­class”. It’s also a functional pseudo-class that accepts a selector or a selector list as its argument. Using :where() limits the impact of a selector’s specificity without changing it. Consider this CSS snippet: a:not( :hover ) { /* Specificity of 0,1,1 */ text-decoration: underline 2px; [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Selecting Elements by Their Index

CSS also provides selectors for matching elements based on their position in the document subtree. These are known as child-indexed pseudo-classes, because they rely on the position or order of the element rather than its type, attributes, or ID. There are five: :first-chiLd :Last-child :onLy-chiLd :nth-chiLd() :nth-Last-chiLd() :first-child and :last-child As you’ve probably guessed from [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Selecting Elements of a Particular Type by Their Index

The pseudo-classes discussed in the previous section match elements if they occupy the given position in a document subtree. For instance, p:nth-Last-chiLd(2) selects every <p> element that’s the next-to-last element of its parent. In this section, we’ll discuss typed child-indexed pseudo-classes. These pseudo-classes also match elements based on the value of their indexes, but matches [ ...] [ ...]

24
Dec
Pseudo- classes in CSS: Styling Form Fields Based on Input

Let’s take a look at some pseudo-classes that are specific to form fields and form field input. These pseudo-classes can be used to style fields based on the validity of user input, whether the field is required or currently enabled. All of the pseudo-classes that follow are specific to forms. As a result, there’s less [ ...] [ ...]

24
Dec
File Organization in CSS

Part of a good CSS architecture is file organization. A monolithic file is fine for solo developers or small projects. For large projects—sites with multiple layouts and content types—it’s smarter to use a modular approach and split your CSS across multiple files. Splitting your CSS across files makes it easier to parcel tasks out to [ ...] [ ...]

25
Dec
Specificity in CSS

Developers who come to CSS from more traditional programming languages sometimes note that CSS has a global scope. In other words, using button as a selector applies those declarations to every <button> element, whether that was intended or not. The “global” nature of CSS is really an issue of specificity and the cascade in Cascading [ ...] [ ...]

25
Dec
  • 1
  • 2
  • 3
  • 4
  • 5

Corporate Management
  • Firm Strategy and Strategic ManagementFirm Strategy and Strategic Management
  • Enterprise Project Management: meaning, benefits, process and best practicesEnterprise Project Management: meaning, benefits, process and best practices
  • Sales Management: Meaning, Objectives, Functions, Scope, Process, Determinants, Tools and Other DetailsSales Management: Meaning, Objectives, Functions, Scope, Process, Determinants, Tools and Other Details
  • Retail Management: Definition, Processes, Best PracticesRetail Management: Definition, Processes, Best Practices
  • Stock market: functioning and investmentsStock market: functioning and investments
  • Marketing and Corporate BrandingMarketing and Corporate Branding
Recommended Post
  • SQL System Catalog: Table InformationSQL System Catalog: Table Information
  • Writing and Committing Code in GitHub: Creating a CommitWriting and Committing Code in GitHub: Creating a Commit
  • Simple Queries in SQL: Rules for Single-Table Query ProcessingSimple Queries in SQL: Rules for Single-Table Query Processing
  • Layouts in CSS: Choosing flex or gridLayouts in CSS: Choosing flex or grid
  • Trees in JavaTrees in Java
  • C++ Problem: Counting the Occurrences of Each LetterC++ Problem: Counting the Occurrences of Each Letter

Scientific Theories
  • Economic Theories and ConceptsEconomic Theories and Concepts
  • Great Thinkers and their Big IdeasGreat Thinkers and their Big Ideas
  • Political Theories and ConceptsPolitical Theories and Concepts
  • List of Theological Belief SystemsList of Theological Belief Systems
  • Social Theories and ConceptsSocial Theories and Concepts
  • Philosophical Theories and ConceptPhilosophical Theories and Concept

Hãy ủng hộ và đồng hành cùng chúng tôi

... trong chia sẻ và phổ biến kiến thức bằng các hành động thiết thực và hoàn toàn miễn phí của bạn.

hotlineTThảo luận đóng góp ý kiến

Nhiệt tình tham gia thảo luận và nêu ý kiến đóng góp, kinh nghiệm thực tế của bạn qua từng bài viết, videos trên website của chúng tôi.

hỗ trợ hkt Chia sẻ có bản quyền

Hãy cập nhật và chia sẻ rộng rãi các bài viết, videos có ghi rõ nguồn của chúng tôi trên Facebook và các kênh thông tin của bạn.

hỗ trợ hkt Đăng ký và likes bài viết, videos

Ủng hộ chúng tôi về tinh thần và bằng những hành động thiết thực và hoàn toàn miễn phí của các bạn trên kênh thông tin của chúng tôi.

HKT Soft

About HKT CHANNEL
About HKT CONSULTANT

Website Structure

Java & JavaScript ,  C & C# & C++,  Python
PHP,  HTML,  CSS, GitHub,   Bootstrap,   Unix & Lunix
Database,  SQL,  SQL Server, Data structures and algorithms 

HKT Consultant JSC.

      "Knowledge - Experience - Success"
- Email: Info@hktsoft.net
- Website:
hktsoft.net

  • Home
  • Programming Languages
    • Popular Programming Languages
      • Core Java
      • JavaScript
      • Advanced Java
      • C
      • C#
      • C++
      • Python
      • PHP
      • HTML
      • CSS
    • Other Programming Languages
      • GitHub
      • Bootstrap
      • AngularJS
      • jQuery
      • MongoDB
      • NodeJS
      • Unix & Linux
    • Database
      • Basic Database
      • SQL
      • SQL Server
      • Data structures and algorithms
    • Website
      • WordPress
      • Joomla
      • Magento
      • Opencart
      • Haravan
  • Corporate Management
    • Entrepreneurship
      • Startup
      • Entrepreneurship
      • Management Science
    • Managing primary activities
      • Marketing
      • Sales management
      • Retail management
      • Import – Export
      • International business
      • E-commerce
      • Project management
      • Product Management
      • Quality Management
      • Logistics Management
      • Supply Chain Management
    • Managing support activities
      • Strategy
      • Human Resource Management
      • Organizational Culture
      • Information System
      • Corporate Finance
      • Stock Market
      • Accounting
      • Office Management
  • Scientific Theories
    • Economic Theories
    • Social Theories
    • Political Theories
    • Philosophies
    • Theology
    • Art Movements
  • About-Us

Login

Lost your password?