UNIT I WEBSITE BASICS, HTML 5, CSS 3, WEB 2.0

-

1.11 Colors ,Shadows,Text,

Transformations,Transitions,Animations,Bootstrap Framework

The following explains how to use colors, shadows, text utilities, transformations, transitions, animations, and the Bootstrap framework in web technologies, with examples primarily using CSS and Bootstrap. 
CSS Concepts
Cascading Style Sheets (CSS) provides core functionalities for styling web elements. 
Concept DescriptionExample (CSS)
ColorsUsed for foreground (text) and background colors.color: blue; background-color: #fff;
ShadowsAdds visual depth to text or box elements.box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
TextControls typography, alignment, capitalization, etc..text-align: center; text-transform: uppercase; font-family: sans-serif;
TransformationsModifies the position, rotation, scale, or skew of an element in 2D or 3D space.transform: rotate(45deg); or transform: scale(1.1);
TransitionsCreates smooth, animated changes to CSS properties over a specified duration.transition: color 0.5s ease-in-out; (on :hover)
AnimationsUses the @keyframes rule for more complex, multi-stage animations with greater control.@keyframes slidein { 0% { left: 0px; } 100% { left: 100px; } }
Bootstrap Framework
Bootstrap is a popular, free, and open-source front-end framework that uses pre-built HTML, CSS, and JavaScript components to build responsive, mobile-first websites. It provides utility classes to quickly apply common styles. 
Examples with Bootstrap
  • Colors: Bootstrap includes an extensive set of color utility classes that map to a color system (primary, success, danger, etc.).
    • Example: <p class="text-primary">This text is blue.</p>
  • Shadows: Shadows can be enabled via Sass variables and applied using utility classes.
    • Example: <div class="shadow-lg">...</div>
  • Text: Bootstrap offers classes for text alignment, transformation, and weight.
    • Example: <p class="text-center text-uppercase fw-bold">Centered, uppercase, bold text</p>
  • Transformations, Transitions, Animations: While Bootstrap doesn't provide extensive utilities for these as part of its core CSS, standard CSS can be integrated with Bootstrap components. Custom animations are usually implemented with your own CSS or JavaScript libraries. 

Comments

Post a Comment

Popular posts from this blog

CS3492 Database Management Systems Syllabus

-
UNIT I RELATIONAL DATABASES  Purpose of Database System – Views of data – Data Models – Database System Architecture – Introduction to relational databases – Relational Model – Keys – Relational Algebra – SQL fundamentals – Advanced SQL features – Embedded SQL– Dynamic SQL UNIT II DATABASE DESIGN Entity-Relationship model – E-R Diagrams – Enhanced-ER Model – ER-to-Relational Mapping – Functional Dependencies – Non-loss Decomposition – First, Second, Third Normal Forms, Dependency Preservation – Boyce/Codd Normal Form – Multi-valued Dependencies and Fourth Normal Form – Join Dependencies and Fifth Normal Form UNIT III TRANSACTIONS Transaction Concepts – ACID Properties – Schedules – Serializability – Transaction support in SQL – Need for Concurrency – Concurrency control – Two Phase Locking - Timestamp – Multiversion – Validation and Snapshot isolation – Multiple Granularity locking – Deadlock Handling – Recovery Concepts – Recovery based on deferred and immed...
Read more

UNIT I RELATIONAL DATABASES

-
Image
 1.7 Keys In the context of a relational database, keys are one of the basic requirements of a relational database model. Keys are fundamental components that ensure data integrity, uniqueness and efficient access. It is widely used to identify the tuples(rows) uniquely in the table. We also use keys to set up relations amongst various columns and tables of a relational database. Keys in DBMS Why do we require Keys in a DBMS? Keys are important in a Database Management System (DBMS) for several reasons: Uniqueness: Keys ensure that each record in a table is unique and can be identified distinctly. Data Integrity: Keys prevent data duplication and maintain the consistency of the data. Efficient Data Retrieval: By defining relationships between tables, keys enable faster querying and better data organization. Without keys, it would be extremely difficult to manage large datasets and queries would become inefficient and prone to errors. Types of Database Keys 1. Super Key The set of o...
Read more